@charset "UTF-8";
/* ================================================== */
/* Aggregate rules for CSS output */
/* ================================================== */
/** Combines style rules and component rules from the full glass3d design system.
* At build time this file compiles into → dist/index.css
*
* Includes:
* themes
* custom properties 
* selectors & rules
*/
/* Styles */
/* ================================================== */
/* ================================================== */
/* Reset */
/* ================================================== */
/* Use box-sizing model or live to regret it */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Kill margin with fire */
/* Causes inconsistent layout behavior with modular components */
/* Gets in the way of layouts that use negative margin to bestow full bleed width */
* {
  margin: 0;
}

html {
  position: relative;
  width: 100%;
  /* Set height to 100% on BOTH html and body to match initial containing block height */
  /* Content will default to full viewport height without messing with: vh/dvh/svh/lvh 100 */
  height: 100%;
  /* You probably want this, unless you like disorienting page jumps */
  scroll-behavior: smooth;
  /* don't set to scroll! 
  or you will get unwanted empty (classic) scrollbars on PC */
}

body {
  width: 100%;
  height: 100%;
  -webkit-font-smoothing: antialiased;
}

/* Remove list styles */
ol,
ul {
  list-style: none;
}

/* Prevent text overflow */
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

/* Remove padding */
a,
ul,
ol,
li,
dl,
dt,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hgroup,
p,
blockquote,
figure,
form,
fieldset,
input,
legend,
pre,
abbr,
button,
body,
textarea,
select {
  padding: 0;
}

/* Reset interactive elements */
a,
input,
button,
textarea,
fieldset,
select {
  font: inherit;
  margin: 0;
  padding: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
  padding-block-start: 0;
  padding-inline-start: 0;
  padding-inline-end: 0;
  padding-block-end: 0;
  background-color: transparent;
  border: 0;
  border-style: none;
  text-decoration: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
  pointer-events: auto;
}

/* ================================================== */
/* Aggregate utils for CSS output */
/* ================================================== */
/* ================================================== */
/* Container-queries */
/* ================================================== */
/* Background container query */
/* ================================================== */
/**The purpose of a container query is to apply styles to a child element based on 
* the size of its container, not the viewport. Hence → width: 100%;
* Used by _card, _accordion, and _glass 
*/
.g3d-container-query-bg {
  container-name: g3d-bg;
  container-type: inline-size;
  width: 100%;
}

/* ================================================== */
/* Edge-to-edge classes */
/* ================================================== */
/* ================================================== */
.g3d-p-0 {
  padding: 0;
}

.g3d-e2e {
  --_space: var(--space, 1rem);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  width: calc(100% + var(--_space) * 2);
  display: grid;
  margin-left: var(--_neg-space);
  margin-right: var(--_neg-space);
  padding: var(--_space);
}
.g3d-e2e.g3d-p-0 {
  padding: 0;
}

.g3d-e2e-no-t {
  margin-top: var(--neg-space);
  --_space: var(--space, 1rem);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  width: calc(100% + var(--_space) * 2);
  display: grid;
  margin-left: var(--_neg-space);
  margin-right: var(--_neg-space);
  padding: var(--_space);
}
.g3d-e2e-no-t.g3d-p-0 {
  padding: 0;
}

.g3d-e2e-no-b {
  margin-bottom: var(--neg-space);
  --_space: var(--space, 1rem);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  width: calc(100% + var(--_space) * 2);
  display: grid;
  margin-left: var(--_neg-space);
  margin-right: var(--_neg-space);
  padding: var(--_space);
}
.g3d-e2e-no-b.g3d-p-0 {
  padding: 0;
}

.g3d-e2e-no-y {
  margin-top: var(--neg-space);
  margin-bottom: var(--neg-space);
  --_space: var(--space, 1rem);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  width: calc(100% + var(--_space) * 2);
  display: grid;
  margin-left: var(--_neg-space);
  margin-right: var(--_neg-space);
  padding: var(--_space);
}
.g3d-e2e-no-y.g3d-p-0 {
  padding: 0;
}

.g3d-e2e-inset {
  margin-left: calc(var(--neg-space) + 1px);
  margin-right: var(--neg-space);
  background-color: var(--g3d-inset-bg-xmild);
  box-shadow: var(--g3d-inset-flat-sm);
  --_space: var(--space, 1rem);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  width: calc(100% + var(--_space) * 2);
  display: grid;
  margin-left: var(--_neg-space);
  margin-right: var(--_neg-space);
  padding: var(--_space);
}
.g3d-e2e-inset.g3d-p-0 {
  padding: 0;
}

/* Remove margin-left offset at 100vw or bigger */
/* the -16px prevents issues with scrollbars cutting into 100vw */
@container g3d-bg (width >= calc(100vw - 16px)) {
  .g3d-e2e-inset {
    margin-left: var(--neg-space);
  }
}
/* ================================================== */
/* Flex */
/* ================================================== */
.g3d-flex {
  display: flex;
}

.g3d-flex-c {
  display: flex;
  justify-content: center;
  align-items: center;
}

.g3d-flex-column-c {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

/* flex-direction: */
/* ================================================== */
.g3d-flex-column {
  display: flex;
  flex-direction: column;
}

.g3d-flex-column-rev {
  display: flex;
  flex-direction: column-reverse;
}

.g3d-flex-row {
  display: flex;
  flex-direction: row;
}

.g3d-flex-row-rev {
  display: flex;
  flex-direction: row-reverse;
}

/* flex-wrap: */
/* ================================================== */
.g3d-flex-wrap {
  display: flex;
  flex-wrap: wrap;
}

.g3d-flex-wrap-rev {
  display: flex;
  flex-wrap: wrap-reverse;
}

.g3d-flex-nowrap {
  display: flex;
  flex-wrap: nowrap;
}

/* justify-content: */
/* ================================================== */
.g3d-justify-l {
  display: flex;
  justify-content: flex-start;
}

.g3d-justify-r {
  display: flex;
  justify-content: flex-end;
}

.g3d-justify-c {
  display: flex;
  justify-content: center;
}

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

.g3d-justify-sa {
  display: flex;
  justify-content: space-around;
}

.g3d-justify-se {
  display: flex;
  justify-content: space-evenly;
}

/* align-items: */
/* ================================================== */
.g3d-align-items-t {
  display: flex;
  align-items: flex-start;
}

.g3d-align-items-c {
  display: flex;
  align-items: center;
}

.g3d-align-items-b {
  display: flex;
  align-items: flex-end;
}

.g3d-align-items-s {
  display: flex;
  align-items: stretch;
}

/* For multi-line flex-wrap */
/* ================================================== */
.g3d-align-content-c {
  display: flex;
  align-content: center;
}

.g3d-align-content-sb {
  display: flex;
  align-content: space-between;
}

.g3d-align-content-sa {
  display: flex;
  align-content: space-around;
}

.g3d-align-content-se {
  display: flex;
  align-content: space-evenly;
}

.g3d-flex-100 {
  display: flex;
  flex: 0 1 100px;
}

/* ================================================== */
/* Grid */
/* ================================================== */
.g3d-grid {
  display: grid;
}

.g3d-grid-c {
  display: grid;
  place-items: center;
}

.g3d-grid-content-c {
  display: grid;
  place-content: center;
}

.g3d-grid-12 {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

/* auto-fill */
/* Fills the row with as many columns as it can fit. So it creates implicit columns. */
.g3d-grid-auto-fill {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
}

/* auto-fit */
/* Fits the columns it has into the space by expanding them. */
.g3d-grid-auto-fit {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}

.g3d-grid-auto-fit-300 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

/* ================================================== */
/* Layout utils */
/* ================================================== */
/* Mixins */
/* ================================================== */
/* Generate classes */
/* ================================================== */
/** Generates utility classes based on a map of tokens.
* $map: SCSS map of keys/values (e.g., sizes, colors)
* $property: CSS property to output (e.g., margin, color)
* $variablePrefix: Prefix for the CSS custom property (e.g., "space" → --space-sm)
* $classSplit: Character(s) between base and key (default: `-`)
*/
/* Sizes MAP */
/* ================================================== */
/* Size modifier mixin */
/* ================================================== */
/* Generates classes using the $sizes map from _spacing.scss */
/* 2 property size modifier mixin */
/* ================================================== */
/* SVG Mask mixin */
/* ================================================== */
/* Pseudo element mixin */
/* ================================================== */
/* ================================================== */
/* Z-index */
/* ================================================== */
/* z-index map */
/* ================================================== */
/* z-index utility function */
/* ================================================== */
/** Returns the numeric z-index value for $z-name from the $z map.
* @param {String} $z-name (e.g. 'nav', 'on-nav')
* @returns {Number|null} Returns the computed z-index value, or null if not found.
* @example scss
*   g3d-z('card');
*/
/* ================================================== */
/* Breakpoints */
/* ================================================== */
/* Breakpoints map */
/* ================================================== */
/* Breakpoint variables */
/* ================================================== */
/* Min width breakpoint mixin */
/* ================================================== */
/** Wraps SCSS in a MIN-width media query based on `$g3d-breakpoints` map.
* @param {String} $breakpoint Options: xs, sm, md, lg, xl, 2xl, 3xl
* @example scss
*   @include g3d-bp('md') { ... }
*/
/* Max width breakpoint mixin */
/* ================================================== */
/** Wraps SCSS in a MAX-width media query based on `$g3d-breakpoints` map.
* @param {String} $breakpoint Options: xs, sm, md, lg, xl, 2xl, 3xl
* @example scss
*   @include bp-max('md') { ... }
*/
/* ================================================== */
/* Display utils */
/* ================================================== */
.g3d-hidden {
  display: none;
  content-visibility: hidden;
  pointer-events: none;
}

.g3d-visible-block {
  display: block;
  content-visibility: visible;
  pointer-events: auto;
}

.g3d-visible-inline {
  display: inline;
  content-visibility: visible;
  pointer-events: auto;
}

/* Margin left-right auto centering */
/* ================================================== */
.g3d-margin-auto-x {
  margin-top: 0;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
}

/* Gap classes */
/* ================================================== */
.g3d-gap-5xs {
  gap: var(--g3d-5xs);
}
.g3d-gap-4xs {
  gap: var(--g3d-4xs);
}
.g3d-gap-3xs {
  gap: var(--g3d-3xs);
}
.g3d-gap-2xs {
  gap: var(--g3d-2xs);
}
.g3d-gap-xs {
  gap: var(--g3d-xs);
}
.g3d-gap-sm {
  gap: var(--g3d-sm);
}
.g3d-gap-md {
  gap: var(--g3d-md);
}
.g3d-gap-lg {
  gap: var(--g3d-lg);
}
.g3d-gap-xl {
  gap: var(--g3d-xl);
}
.g3d-gap-2xl {
  gap: var(--g3d-2xl);
}
.g3d-gap-3xl {
  gap: var(--g3d-3xl);
}
.g3d-gap-4xl {
  gap: var(--g3d-4xl);
}
.g3d-gap-5xl {
  gap: var(--g3d-5xl);
}

.g3d-section-gap {
  z-index: 3;
  display: grid;
  gap: 6rem;
}
@media (width >= 30.5rem) {
  .g3d-section-gap {
    gap: 8rem;
  }
}
@media (width >= 48rem) {
  .g3d-section-gap {
    gap: 10rem;
  }
}
@media (width >= 64rem) {
  .g3d-section-gap {
    gap: 11rem;
  }
}
@media (width >= 80rem) {
  .g3d-section-gap {
    gap: 12rem;
  }
}

/* ================================================== */
/* g3d-moat Spacing System */
/* ================================================== */
/** Moats are wrapper classes that create consistent, spacing between 
* the left/right edges of the viewport and their child elements. 
*
* Maximize screen real estate on mobile
* Keep consistent left-right spacing across elements like nav and footer
* while also giving some elements like large images, or hero sections 
* the ability to stretch edge-to-edge (“full-bleed”) for maximum impact.
*
* * Make sure to set on a element that takes up full screen width!
*   width: 100% is used rather than width: 100vw because of scroll bar
*   inconsistencies across devices and browsers
*
* The -sm, -md, etc. endings refer to matching breakpoints 
*/
/* g3d-moats */
/* ================================================== */
:root {
  --g3d-bp-sm: 30.5rem;
  --g3d-bp-md: 48rem;
  --g3d-bp-lg: 64rem;
  --g3d-bp-xl: 80rem;
  --g3d-bp-2xl: 90rem;
  /* set in brand tokens */
  /* set in brand tokens */
  --g3d-moat-xs-x2: calc(var(--g3d-moat-xs) * 2);
  --g3d-moat-sm-x2: calc(var(--g3d-moat-sm) * 2);
  --g3d-moat-md-x2: calc(var(--g3d-moat-md) * 2);
  --g3d-moat-lg-x2: calc(var(--g3d-moat-lg) * 2);
  --g3d-moat-xl-x2: calc(var(--g3d-moat-xl) * 2);
  --g3d-moat-2xl-x2: calc(var(--g3d-moat-2xl) * 2);
  --g3d-moat: var(--g3d-moat-xs);
  --g3d-moat-x2: calc(var(--g3d-moat) * 2);
  --g3d-width-minus-moat: calc(100% - var(--g3d-moat-x2));
}
@media (width >= 30.5rem) {
  :root {
    --g3d-moat: var(--g3d-moat-sm);
  }
}
@media (width >= 48rem) {
  :root {
    --g3d-moat: var(--g3d-moat-md);
  }
}
@media (width >= 64rem) {
  :root {
    --g3d-moat: var(--g3d-moat-lg);
  }
}
@media (width >= 80rem) {
  :root {
    --g3d-moat: var(--g3d-moat-xl);
  }
}
@media (width >= 90rem) {
  :root {
    --g3d-moat: var(--g3d-moat-2xl);
  }
}

/* g3d-moat */
/* ================================================== */
/* g3d-moat-all */
/* ================================================== */
/** All breakpoints get a "moat" aka consistent space between elements and screen edge
*/
.g3d-moat-all {
  width: 100%;
  max-width: min(100%, var(--g3d-general-max-width));
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-self: start center;
  place-items: start center;
}
.g3d-moat-all.g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
.g3d-moat-all .g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
.g3d-moat-all {
  width: var(--g3d-width-minus-moat);
}

/* g3d-moat-from-sm */
/* ================================================== */
/** On small screens child element stretches “full-bleed” for maximum impact.
*  When width reaches the `--g3d-bp-sm` breakpoint or bigger, 
*  child element gets left/right "moat" (spacing from screen edge)
*/
.g3d-moat-from-sm {
  width: 100%;
  max-width: min(100%, var(--g3d-general-max-width));
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-self: start center;
  place-items: start center;
}
.g3d-moat-from-sm.g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
.g3d-moat-from-sm .g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
@media (width >= 30.5rem) {
  .g3d-moat-from-sm {
    width: var(--g3d-width-minus-moat);
  }
}

.g3d-moat-from-md {
  width: 100%;
  max-width: min(100%, var(--g3d-general-max-width));
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-self: start center;
  place-items: start center;
}
.g3d-moat-from-md.g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
.g3d-moat-from-md .g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
@media (width >= 48rem) {
  .g3d-moat-from-md {
    width: var(--g3d-width-minus-moat);
  }
}

.g3d-moat-from-lg {
  width: 100%;
  max-width: min(100%, var(--g3d-general-max-width));
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-self: start center;
  place-items: start center;
}
.g3d-moat-from-lg.g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
.g3d-moat-from-lg .g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
@media (width >= 64rem) {
  .g3d-moat-from-lg {
    width: var(--g3d-width-minus-moat);
  }
}

.g3d-moat-from-xl {
  width: 100%;
  max-width: min(100%, var(--g3d-general-max-width));
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-self: start center;
  place-items: start center;
}
.g3d-moat-from-xl.g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
.g3d-moat-from-xl .g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
@media (width >= 80rem) {
  .g3d-moat-from-xl {
    width: var(--g3d-width-minus-moat);
  }
}

.g3d-moat-from-2xl {
  width: 100%;
  max-width: min(100%, var(--g3d-general-max-width));
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-self: start center;
  place-items: start center;
}
.g3d-moat-from-2xl.g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
.g3d-moat-from-2xl .g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}
@media (width >= 90rem) {
  .g3d-moat-from-2xl {
    width: var(--g3d-width-minus-moat);
  }
}

/* ================================================== */
/* Text utils */
/* ================================================== */
.text-max-w {
  max-width: 70ch;
}

/* text-align: */
/* ================================================== */
.g3d-text-center {
  text-align: center;
}

.g3d-text-left {
  text-align: start;
}

.g3d-text-right {
  text-align: end;
}

.g3d-text-justify {
  text-align: justify;
}

/* text-transform: */
/* ================================================== */
.g3d-text-allcap {
  text-transform: uppercase;
}

.g3d-text-lower {
  text-transform: lowercase;
}

.g3d-text-bold {
  font-weight: var(--g3d-font-weight-lg);
}

.g3d-text-line-through {
  text-decoration: line-through;
}

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

.g3d-first-line-bold:first-line {
  font-weight: var(--g3d-font-weight-lg);
}

.g3d-ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.g3d-break-word {
  overflow-wrap: break-word;
  min-width: 0;
}

.g3d-no-word-break {
  word-break: keep-all;
}

/* Bullet points */
/* ================================================== */
.g3d-dot::before {
  content: "•";
  padding-right: 0.25em;
}

.g3d-arrow::before {
  content: "→";
  padding-right: 0.25em;
}

/* ================================================== */
/* Width */
/* ================================================== */
:root {
  --g3d-w-3xs: 16rem;
  --g3d-w-2xs: 18rem;
  --g3d-w-xs: 20rem;
  --g3d-w-sm: 24rem;
  --g3d-w-md: 28rem;
  --g3d-w-lg: 32rem;
  --g3d-w-xl: 36rem;
  --g3d-w-2xl: 42rem;
  --g3d-w-3xl: 48rem;
  --g3d-w-4xl: 56rem;
  --g3d-w-5xl: 64rem;
  --g3d-w-6xl: 72rem;
  --g3d-w-7xl: 80rem;
}

/* 16rem (256px) */
.g3d-w-3xs {
  width: min(100%, var(--g3d-w-3xs));
}

/* 18rem (288px) */
.g3d-w-2xs {
  width: min(100%, var(--g3d-w-2xs));
}

/* 20rem (320px) */
.g3d-w-xs {
  width: min(100%, var(--g3d-w-xs));
}

/* 24rem (384px) */
.g3d-w-sm {
  width: min(100%, var(--g3d-w-sm));
}

/* 28rem (448px) */
.g3d-w-md {
  width: min(100%, var(--g3d-w-md));
}

/* 32rem (512px) */
.g3d-w-lg {
  width: min(100%, var(--g3d-w-lg));
}

/* 36rem (576px) */
.g3d-w-xl {
  width: min(100%, var(--g3d-w-xl));
}

/* 42rem (672px) */
.g3d-w-2xl {
  width: min(100%, var(--g3d-w-2xl));
}

/* 48rem (768px) */
.g3d-w-3xl {
  width: min(100%, var(--g3d-w-3xl));
}

/* 56rem (896px) */
.g3d-w-4xl {
  width: min(100%, var(--g3d-w-4xl));
}

/* 64rem (1024px) */
.g3d-w-5xl {
  width: min(100%, var(--g3d-w-5xl));
}

/* 72rem (1152px) */
.g3d-w-6xl {
  width: min(100%, var(--g3d-w-6xl));
}

/* 80rem (1280px) */
.g3d-w-7xl {
  width: min(100%, var(--g3d-w-7xl));
}

/* Other */
.g3d-w-100 {
  width: 100%;
}

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

.g3d-w-fit-max {
  width: -moz-max-content;
  width: max-content;
}

.g3d-w-fit-min {
  width: -moz-min-content;
  width: min-content;
}

/* ================================================== */
/* Media */
/* ================================================== */
.g3d-visual-media-center {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
  -o-object-position: center;
     object-position: center;
}

/* Top */
/* ================================================== */
.g3d-visual-media-top-center {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
  -o-object-position: top center;
     object-position: top center;
}

.g3d-visual-media-top-left {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
  -o-object-position: top left;
     object-position: top left;
}

.g3d-visual-media-top-right {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
  -o-object-position: top right;
     object-position: top right;
}

/* Bottom */
/* ================================================== */
.g3d-visual-media-bottom-center {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
  -o-object-position: bottom center;
     object-position: bottom center;
}

.g3d-visual-media-bottom-left {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
  -o-object-position: bottom left;
     object-position: bottom left;
}

.g3d-visual-media-bottom-right {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  overflow: hidden;
  -o-object-position: bottom right;
     object-position: bottom right;
}

/* ================================================== */
/* Aggregate token rules for CSS output */
/* ================================================== */
/* ================================================== */
/* Layout utils */
/* AUTO-GENERATED file ⚠️ DO NOT EDIT BY HAND ⚠️ */
/* ================================================== */
/** This file is generated by: /src/g3d-helper-scripts/g3d-generate-icons-scss.ts
 * Icon files located in: /public/icons/
 * Add or remove SVGs then build from root: pnpm run generate-icons-scss
 */
.svg-acorn {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-acorn, url("/icons/acorn.svg"));
          mask: var(--icon-url-acorn, url("/icons/acorn.svg"));
}

.svg-address-book-tabs {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-address-book-tabs, url("/icons/address-book-tabs.svg"));
          mask: var(--icon-url-address-book-tabs, url("/icons/address-book-tabs.svg"));
}

.svg-address-book {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-address-book, url("/icons/address-book.svg"));
          mask: var(--icon-url-address-book, url("/icons/address-book.svg"));
}

.svg-air-traffic-control {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-air-traffic-control, url("/icons/air-traffic-control.svg"));
          mask: var(--icon-url-air-traffic-control, url("/icons/air-traffic-control.svg"));
}

.svg-airplane-in-flight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-airplane-in-flight, url("/icons/airplane-in-flight.svg"));
          mask: var(--icon-url-airplane-in-flight, url("/icons/airplane-in-flight.svg"));
}

.svg-airplane-landing {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-airplane-landing, url("/icons/airplane-landing.svg"));
          mask: var(--icon-url-airplane-landing, url("/icons/airplane-landing.svg"));
}

.svg-airplane-takeoff {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-airplane-takeoff, url("/icons/airplane-takeoff.svg"));
          mask: var(--icon-url-airplane-takeoff, url("/icons/airplane-takeoff.svg"));
}

.svg-airplane-taxiing {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-airplane-taxiing, url("/icons/airplane-taxiing.svg"));
          mask: var(--icon-url-airplane-taxiing, url("/icons/airplane-taxiing.svg"));
}

.svg-airplane-tilt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-airplane-tilt, url("/icons/airplane-tilt.svg"));
          mask: var(--icon-url-airplane-tilt, url("/icons/airplane-tilt.svg"));
}

.svg-airplane {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-airplane, url("/icons/airplane.svg"));
          mask: var(--icon-url-airplane, url("/icons/airplane.svg"));
}

.svg-airplay {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-airplay, url("/icons/airplay.svg"));
          mask: var(--icon-url-airplay, url("/icons/airplay.svg"));
}

.svg-alarm {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-alarm, url("/icons/alarm.svg"));
          mask: var(--icon-url-alarm, url("/icons/alarm.svg"));
}

.svg-alien {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-alien, url("/icons/alien.svg"));
          mask: var(--icon-url-alien, url("/icons/alien.svg"));
}

.svg-align-bottom-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-bottom-simple, url("/icons/align-bottom-simple.svg"));
          mask: var(--icon-url-align-bottom-simple, url("/icons/align-bottom-simple.svg"));
}

.svg-align-bottom {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-bottom, url("/icons/align-bottom.svg"));
          mask: var(--icon-url-align-bottom, url("/icons/align-bottom.svg"));
}

.svg-align-center-horizontal-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-center-horizontal-simple, url("/icons/align-center-horizontal-simple.svg"));
          mask: var(--icon-url-align-center-horizontal-simple, url("/icons/align-center-horizontal-simple.svg"));
}

.svg-align-center-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-center-horizontal, url("/icons/align-center-horizontal.svg"));
          mask: var(--icon-url-align-center-horizontal, url("/icons/align-center-horizontal.svg"));
}

.svg-align-center-vertical-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-center-vertical-simple, url("/icons/align-center-vertical-simple.svg"));
          mask: var(--icon-url-align-center-vertical-simple, url("/icons/align-center-vertical-simple.svg"));
}

.svg-align-center-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-center-vertical, url("/icons/align-center-vertical.svg"));
          mask: var(--icon-url-align-center-vertical, url("/icons/align-center-vertical.svg"));
}

.svg-align-left-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-left-simple, url("/icons/align-left-simple.svg"));
          mask: var(--icon-url-align-left-simple, url("/icons/align-left-simple.svg"));
}

.svg-align-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-left, url("/icons/align-left.svg"));
          mask: var(--icon-url-align-left, url("/icons/align-left.svg"));
}

.svg-align-right-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-right-simple, url("/icons/align-right-simple.svg"));
          mask: var(--icon-url-align-right-simple, url("/icons/align-right-simple.svg"));
}

.svg-align-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-right, url("/icons/align-right.svg"));
          mask: var(--icon-url-align-right, url("/icons/align-right.svg"));
}

.svg-align-top-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-top-simple, url("/icons/align-top-simple.svg"));
          mask: var(--icon-url-align-top-simple, url("/icons/align-top-simple.svg"));
}

.svg-align-top {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-align-top, url("/icons/align-top.svg"));
          mask: var(--icon-url-align-top, url("/icons/align-top.svg"));
}

.svg-amazon-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-amazon-logo, url("/icons/amazon-logo.svg"));
          mask: var(--icon-url-amazon-logo, url("/icons/amazon-logo.svg"));
}

.svg-ambulance {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ambulance, url("/icons/ambulance.svg"));
          mask: var(--icon-url-ambulance, url("/icons/ambulance.svg"));
}

.svg-anchor-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-anchor-simple, url("/icons/anchor-simple.svg"));
          mask: var(--icon-url-anchor-simple, url("/icons/anchor-simple.svg"));
}

.svg-anchor {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-anchor, url("/icons/anchor.svg"));
          mask: var(--icon-url-anchor, url("/icons/anchor.svg"));
}

.svg-android-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-android-logo, url("/icons/android-logo.svg"));
          mask: var(--icon-url-android-logo, url("/icons/android-logo.svg"));
}

.svg-angle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-angle, url("/icons/angle.svg"));
          mask: var(--icon-url-angle, url("/icons/angle.svg"));
}

.svg-angular-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-angular-logo, url("/icons/angular-logo.svg"));
          mask: var(--icon-url-angular-logo, url("/icons/angular-logo.svg"));
}

.svg-aperture {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-aperture, url("/icons/aperture.svg"));
          mask: var(--icon-url-aperture, url("/icons/aperture.svg"));
}

.svg-app-store-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-app-store-logo, url("/icons/app-store-logo.svg"));
          mask: var(--icon-url-app-store-logo, url("/icons/app-store-logo.svg"));
}

.svg-app-window {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-app-window, url("/icons/app-window.svg"));
          mask: var(--icon-url-app-window, url("/icons/app-window.svg"));
}

.svg-apple-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-apple-logo, url("/icons/apple-logo.svg"));
          mask: var(--icon-url-apple-logo, url("/icons/apple-logo.svg"));
}

.svg-apple-podcasts-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-apple-podcasts-logo, url("/icons/apple-podcasts-logo.svg"));
          mask: var(--icon-url-apple-podcasts-logo, url("/icons/apple-podcasts-logo.svg"));
}

.svg-approximate-equals {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-approximate-equals, url("/icons/approximate-equals.svg"));
          mask: var(--icon-url-approximate-equals, url("/icons/approximate-equals.svg"));
}

.svg-archive {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-archive, url("/icons/archive.svg"));
          mask: var(--icon-url-archive, url("/icons/archive.svg"));
}

.svg-armchair {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-armchair, url("/icons/armchair.svg"));
          mask: var(--icon-url-armchair, url("/icons/armchair.svg"));
}

.svg-arrow-arc-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-arc-left, url("/icons/arrow-arc-left.svg"));
          mask: var(--icon-url-arrow-arc-left, url("/icons/arrow-arc-left.svg"));
}

.svg-arrow-arc-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-arc-right, url("/icons/arrow-arc-right.svg"));
          mask: var(--icon-url-arrow-arc-right, url("/icons/arrow-arc-right.svg"));
}

.svg-arrow-bend-double-up-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-double-up-left, url("/icons/arrow-bend-double-up-left.svg"));
          mask: var(--icon-url-arrow-bend-double-up-left, url("/icons/arrow-bend-double-up-left.svg"));
}

.svg-arrow-bend-double-up-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-double-up-right, url("/icons/arrow-bend-double-up-right.svg"));
          mask: var(--icon-url-arrow-bend-double-up-right, url("/icons/arrow-bend-double-up-right.svg"));
}

.svg-arrow-bend-down-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-down-left, url("/icons/arrow-bend-down-left.svg"));
          mask: var(--icon-url-arrow-bend-down-left, url("/icons/arrow-bend-down-left.svg"));
}

.svg-arrow-bend-down-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-down-right, url("/icons/arrow-bend-down-right.svg"));
          mask: var(--icon-url-arrow-bend-down-right, url("/icons/arrow-bend-down-right.svg"));
}

.svg-arrow-bend-left-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-left-down, url("/icons/arrow-bend-left-down.svg"));
          mask: var(--icon-url-arrow-bend-left-down, url("/icons/arrow-bend-left-down.svg"));
}

.svg-arrow-bend-left-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-left-up, url("/icons/arrow-bend-left-up.svg"));
          mask: var(--icon-url-arrow-bend-left-up, url("/icons/arrow-bend-left-up.svg"));
}

.svg-arrow-bend-right-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-right-down, url("/icons/arrow-bend-right-down.svg"));
          mask: var(--icon-url-arrow-bend-right-down, url("/icons/arrow-bend-right-down.svg"));
}

.svg-arrow-bend-right-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-right-up, url("/icons/arrow-bend-right-up.svg"));
          mask: var(--icon-url-arrow-bend-right-up, url("/icons/arrow-bend-right-up.svg"));
}

.svg-arrow-bend-up-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-up-left, url("/icons/arrow-bend-up-left.svg"));
          mask: var(--icon-url-arrow-bend-up-left, url("/icons/arrow-bend-up-left.svg"));
}

.svg-arrow-bend-up-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-bend-up-right, url("/icons/arrow-bend-up-right.svg"));
          mask: var(--icon-url-arrow-bend-up-right, url("/icons/arrow-bend-up-right.svg"));
}

.svg-arrow-circle-down-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-circle-down-left, url("/icons/arrow-circle-down-left.svg"));
          mask: var(--icon-url-arrow-circle-down-left, url("/icons/arrow-circle-down-left.svg"));
}

.svg-arrow-circle-down-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-circle-down-right, url("/icons/arrow-circle-down-right.svg"));
          mask: var(--icon-url-arrow-circle-down-right, url("/icons/arrow-circle-down-right.svg"));
}

.svg-arrow-circle-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-circle-down, url("/icons/arrow-circle-down.svg"));
          mask: var(--icon-url-arrow-circle-down, url("/icons/arrow-circle-down.svg"));
}

.svg-arrow-circle-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-circle-left, url("/icons/arrow-circle-left.svg"));
          mask: var(--icon-url-arrow-circle-left, url("/icons/arrow-circle-left.svg"));
}

.svg-arrow-circle-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-circle-right, url("/icons/arrow-circle-right.svg"));
          mask: var(--icon-url-arrow-circle-right, url("/icons/arrow-circle-right.svg"));
}

.svg-arrow-circle-up-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-circle-up-left, url("/icons/arrow-circle-up-left.svg"));
          mask: var(--icon-url-arrow-circle-up-left, url("/icons/arrow-circle-up-left.svg"));
}

.svg-arrow-circle-up-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-circle-up-right, url("/icons/arrow-circle-up-right.svg"));
          mask: var(--icon-url-arrow-circle-up-right, url("/icons/arrow-circle-up-right.svg"));
}

.svg-arrow-circle-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-circle-up, url("/icons/arrow-circle-up.svg"));
          mask: var(--icon-url-arrow-circle-up, url("/icons/arrow-circle-up.svg"));
}

.svg-arrow-clockwise {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-clockwise, url("/icons/arrow-clockwise.svg"));
          mask: var(--icon-url-arrow-clockwise, url("/icons/arrow-clockwise.svg"));
}

.svg-arrow-counter-clockwise {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-counter-clockwise, url("/icons/arrow-counter-clockwise.svg"));
          mask: var(--icon-url-arrow-counter-clockwise, url("/icons/arrow-counter-clockwise.svg"));
}

.svg-arrow-down-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-down-left, url("/icons/arrow-down-left.svg"));
          mask: var(--icon-url-arrow-down-left, url("/icons/arrow-down-left.svg"));
}

.svg-arrow-down-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-down-right, url("/icons/arrow-down-right.svg"));
          mask: var(--icon-url-arrow-down-right, url("/icons/arrow-down-right.svg"));
}

.svg-arrow-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-down, url("/icons/arrow-down.svg"));
          mask: var(--icon-url-arrow-down, url("/icons/arrow-down.svg"));
}

.svg-arrow-elbow-down-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-down-left, url("/icons/arrow-elbow-down-left.svg"));
          mask: var(--icon-url-arrow-elbow-down-left, url("/icons/arrow-elbow-down-left.svg"));
}

.svg-arrow-elbow-down-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-down-right, url("/icons/arrow-elbow-down-right.svg"));
          mask: var(--icon-url-arrow-elbow-down-right, url("/icons/arrow-elbow-down-right.svg"));
}

.svg-arrow-elbow-left-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-left-down, url("/icons/arrow-elbow-left-down.svg"));
          mask: var(--icon-url-arrow-elbow-left-down, url("/icons/arrow-elbow-left-down.svg"));
}

.svg-arrow-elbow-left-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-left-up, url("/icons/arrow-elbow-left-up.svg"));
          mask: var(--icon-url-arrow-elbow-left-up, url("/icons/arrow-elbow-left-up.svg"));
}

.svg-arrow-elbow-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-left, url("/icons/arrow-elbow-left.svg"));
          mask: var(--icon-url-arrow-elbow-left, url("/icons/arrow-elbow-left.svg"));
}

.svg-arrow-elbow-right-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-right-down, url("/icons/arrow-elbow-right-down.svg"));
          mask: var(--icon-url-arrow-elbow-right-down, url("/icons/arrow-elbow-right-down.svg"));
}

.svg-arrow-elbow-right-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-right-up, url("/icons/arrow-elbow-right-up.svg"));
          mask: var(--icon-url-arrow-elbow-right-up, url("/icons/arrow-elbow-right-up.svg"));
}

.svg-arrow-elbow-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-right, url("/icons/arrow-elbow-right.svg"));
          mask: var(--icon-url-arrow-elbow-right, url("/icons/arrow-elbow-right.svg"));
}

.svg-arrow-elbow-up-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-up-left, url("/icons/arrow-elbow-up-left.svg"));
          mask: var(--icon-url-arrow-elbow-up-left, url("/icons/arrow-elbow-up-left.svg"));
}

.svg-arrow-elbow-up-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-elbow-up-right, url("/icons/arrow-elbow-up-right.svg"));
          mask: var(--icon-url-arrow-elbow-up-right, url("/icons/arrow-elbow-up-right.svg"));
}

.svg-arrow-fat-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-down, url("/icons/arrow-fat-down.svg"));
          mask: var(--icon-url-arrow-fat-down, url("/icons/arrow-fat-down.svg"));
}

.svg-arrow-fat-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-left, url("/icons/arrow-fat-left.svg"));
          mask: var(--icon-url-arrow-fat-left, url("/icons/arrow-fat-left.svg"));
}

.svg-arrow-fat-line-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-line-down, url("/icons/arrow-fat-line-down.svg"));
          mask: var(--icon-url-arrow-fat-line-down, url("/icons/arrow-fat-line-down.svg"));
}

.svg-arrow-fat-line-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-line-left, url("/icons/arrow-fat-line-left.svg"));
          mask: var(--icon-url-arrow-fat-line-left, url("/icons/arrow-fat-line-left.svg"));
}

.svg-arrow-fat-line-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-line-right, url("/icons/arrow-fat-line-right.svg"));
          mask: var(--icon-url-arrow-fat-line-right, url("/icons/arrow-fat-line-right.svg"));
}

.svg-arrow-fat-line-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-line-up, url("/icons/arrow-fat-line-up.svg"));
          mask: var(--icon-url-arrow-fat-line-up, url("/icons/arrow-fat-line-up.svg"));
}

.svg-arrow-fat-lines-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-lines-down, url("/icons/arrow-fat-lines-down.svg"));
          mask: var(--icon-url-arrow-fat-lines-down, url("/icons/arrow-fat-lines-down.svg"));
}

.svg-arrow-fat-lines-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-lines-left, url("/icons/arrow-fat-lines-left.svg"));
          mask: var(--icon-url-arrow-fat-lines-left, url("/icons/arrow-fat-lines-left.svg"));
}

.svg-arrow-fat-lines-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-lines-right, url("/icons/arrow-fat-lines-right.svg"));
          mask: var(--icon-url-arrow-fat-lines-right, url("/icons/arrow-fat-lines-right.svg"));
}

.svg-arrow-fat-lines-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-lines-up, url("/icons/arrow-fat-lines-up.svg"));
          mask: var(--icon-url-arrow-fat-lines-up, url("/icons/arrow-fat-lines-up.svg"));
}

.svg-arrow-fat-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-right, url("/icons/arrow-fat-right.svg"));
          mask: var(--icon-url-arrow-fat-right, url("/icons/arrow-fat-right.svg"));
}

.svg-arrow-fat-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-fat-up, url("/icons/arrow-fat-up.svg"));
          mask: var(--icon-url-arrow-fat-up, url("/icons/arrow-fat-up.svg"));
}

.svg-arrow-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-left, url("/icons/arrow-left.svg"));
          mask: var(--icon-url-arrow-left, url("/icons/arrow-left.svg"));
}

.svg-arrow-line-down-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-line-down-left, url("/icons/arrow-line-down-left.svg"));
          mask: var(--icon-url-arrow-line-down-left, url("/icons/arrow-line-down-left.svg"));
}

.svg-arrow-line-down-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-line-down-right, url("/icons/arrow-line-down-right.svg"));
          mask: var(--icon-url-arrow-line-down-right, url("/icons/arrow-line-down-right.svg"));
}

.svg-arrow-line-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-line-down, url("/icons/arrow-line-down.svg"));
          mask: var(--icon-url-arrow-line-down, url("/icons/arrow-line-down.svg"));
}

.svg-arrow-line-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-line-left, url("/icons/arrow-line-left.svg"));
          mask: var(--icon-url-arrow-line-left, url("/icons/arrow-line-left.svg"));
}

.svg-arrow-line-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-line-right, url("/icons/arrow-line-right.svg"));
          mask: var(--icon-url-arrow-line-right, url("/icons/arrow-line-right.svg"));
}

.svg-arrow-line-up-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-line-up-left, url("/icons/arrow-line-up-left.svg"));
          mask: var(--icon-url-arrow-line-up-left, url("/icons/arrow-line-up-left.svg"));
}

.svg-arrow-line-up-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-line-up-right, url("/icons/arrow-line-up-right.svg"));
          mask: var(--icon-url-arrow-line-up-right, url("/icons/arrow-line-up-right.svg"));
}

.svg-arrow-line-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-line-up, url("/icons/arrow-line-up.svg"));
          mask: var(--icon-url-arrow-line-up, url("/icons/arrow-line-up.svg"));
}

.svg-arrow-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-right, url("/icons/arrow-right.svg"));
          mask: var(--icon-url-arrow-right, url("/icons/arrow-right.svg"));
}

.svg-arrow-square-down-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-down-left, url("/icons/arrow-square-down-left.svg"));
          mask: var(--icon-url-arrow-square-down-left, url("/icons/arrow-square-down-left.svg"));
}

.svg-arrow-square-down-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-down-right, url("/icons/arrow-square-down-right.svg"));
          mask: var(--icon-url-arrow-square-down-right, url("/icons/arrow-square-down-right.svg"));
}

.svg-arrow-square-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-down, url("/icons/arrow-square-down.svg"));
          mask: var(--icon-url-arrow-square-down, url("/icons/arrow-square-down.svg"));
}

.svg-arrow-square-in {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-in, url("/icons/arrow-square-in.svg"));
          mask: var(--icon-url-arrow-square-in, url("/icons/arrow-square-in.svg"));
}

.svg-arrow-square-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-left, url("/icons/arrow-square-left.svg"));
          mask: var(--icon-url-arrow-square-left, url("/icons/arrow-square-left.svg"));
}

.svg-arrow-square-out {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-out, url("/icons/arrow-square-out.svg"));
          mask: var(--icon-url-arrow-square-out, url("/icons/arrow-square-out.svg"));
}

.svg-arrow-square-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-right, url("/icons/arrow-square-right.svg"));
          mask: var(--icon-url-arrow-square-right, url("/icons/arrow-square-right.svg"));
}

.svg-arrow-square-up-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-up-left, url("/icons/arrow-square-up-left.svg"));
          mask: var(--icon-url-arrow-square-up-left, url("/icons/arrow-square-up-left.svg"));
}

.svg-arrow-square-up-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-up-right, url("/icons/arrow-square-up-right.svg"));
          mask: var(--icon-url-arrow-square-up-right, url("/icons/arrow-square-up-right.svg"));
}

.svg-arrow-square-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-square-up, url("/icons/arrow-square-up.svg"));
          mask: var(--icon-url-arrow-square-up, url("/icons/arrow-square-up.svg"));
}

.svg-arrow-u-down-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-u-down-left, url("/icons/arrow-u-down-left.svg"));
          mask: var(--icon-url-arrow-u-down-left, url("/icons/arrow-u-down-left.svg"));
}

.svg-arrow-u-down-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-u-down-right, url("/icons/arrow-u-down-right.svg"));
          mask: var(--icon-url-arrow-u-down-right, url("/icons/arrow-u-down-right.svg"));
}

.svg-arrow-u-left-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-u-left-down, url("/icons/arrow-u-left-down.svg"));
          mask: var(--icon-url-arrow-u-left-down, url("/icons/arrow-u-left-down.svg"));
}

.svg-arrow-u-left-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-u-left-up, url("/icons/arrow-u-left-up.svg"));
          mask: var(--icon-url-arrow-u-left-up, url("/icons/arrow-u-left-up.svg"));
}

.svg-arrow-u-right-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-u-right-down, url("/icons/arrow-u-right-down.svg"));
          mask: var(--icon-url-arrow-u-right-down, url("/icons/arrow-u-right-down.svg"));
}

.svg-arrow-u-right-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-u-right-up, url("/icons/arrow-u-right-up.svg"));
          mask: var(--icon-url-arrow-u-right-up, url("/icons/arrow-u-right-up.svg"));
}

.svg-arrow-u-up-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-u-up-left, url("/icons/arrow-u-up-left.svg"));
          mask: var(--icon-url-arrow-u-up-left, url("/icons/arrow-u-up-left.svg"));
}

.svg-arrow-u-up-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-u-up-right, url("/icons/arrow-u-up-right.svg"));
          mask: var(--icon-url-arrow-u-up-right, url("/icons/arrow-u-up-right.svg"));
}

.svg-arrow-up-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-up-left, url("/icons/arrow-up-left.svg"));
          mask: var(--icon-url-arrow-up-left, url("/icons/arrow-up-left.svg"));
}

.svg-arrow-up-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-up-right, url("/icons/arrow-up-right.svg"));
          mask: var(--icon-url-arrow-up-right, url("/icons/arrow-up-right.svg"));
}

.svg-arrow-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrow-up, url("/icons/arrow-up.svg"));
          mask: var(--icon-url-arrow-up, url("/icons/arrow-up.svg"));
}

.svg-arrows-clockwise {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-clockwise, url("/icons/arrows-clockwise.svg"));
          mask: var(--icon-url-arrows-clockwise, url("/icons/arrows-clockwise.svg"));
}

.svg-arrows-counter-clockwise {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-counter-clockwise, url("/icons/arrows-counter-clockwise.svg"));
          mask: var(--icon-url-arrows-counter-clockwise, url("/icons/arrows-counter-clockwise.svg"));
}

.svg-arrows-down-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-down-up, url("/icons/arrows-down-up.svg"));
          mask: var(--icon-url-arrows-down-up, url("/icons/arrows-down-up.svg"));
}

.svg-arrows-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-horizontal, url("/icons/arrows-horizontal.svg"));
          mask: var(--icon-url-arrows-horizontal, url("/icons/arrows-horizontal.svg"));
}

.svg-arrows-in-cardinal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-in-cardinal, url("/icons/arrows-in-cardinal.svg"));
          mask: var(--icon-url-arrows-in-cardinal, url("/icons/arrows-in-cardinal.svg"));
}

.svg-arrows-in-line-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-in-line-horizontal, url("/icons/arrows-in-line-horizontal.svg"));
          mask: var(--icon-url-arrows-in-line-horizontal, url("/icons/arrows-in-line-horizontal.svg"));
}

.svg-arrows-in-line-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-in-line-vertical, url("/icons/arrows-in-line-vertical.svg"));
          mask: var(--icon-url-arrows-in-line-vertical, url("/icons/arrows-in-line-vertical.svg"));
}

.svg-arrows-in-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-in-simple, url("/icons/arrows-in-simple.svg"));
          mask: var(--icon-url-arrows-in-simple, url("/icons/arrows-in-simple.svg"));
}

.svg-arrows-in {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-in, url("/icons/arrows-in.svg"));
          mask: var(--icon-url-arrows-in, url("/icons/arrows-in.svg"));
}

.svg-arrows-left-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-left-right, url("/icons/arrows-left-right.svg"));
          mask: var(--icon-url-arrows-left-right, url("/icons/arrows-left-right.svg"));
}

.svg-arrows-merge {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-merge, url("/icons/arrows-merge.svg"));
          mask: var(--icon-url-arrows-merge, url("/icons/arrows-merge.svg"));
}

.svg-arrows-out-cardinal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-out-cardinal, url("/icons/arrows-out-cardinal.svg"));
          mask: var(--icon-url-arrows-out-cardinal, url("/icons/arrows-out-cardinal.svg"));
}

.svg-arrows-out-line-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-out-line-horizontal, url("/icons/arrows-out-line-horizontal.svg"));
          mask: var(--icon-url-arrows-out-line-horizontal, url("/icons/arrows-out-line-horizontal.svg"));
}

.svg-arrows-out-line-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-out-line-vertical, url("/icons/arrows-out-line-vertical.svg"));
          mask: var(--icon-url-arrows-out-line-vertical, url("/icons/arrows-out-line-vertical.svg"));
}

.svg-arrows-out-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-out-simple, url("/icons/arrows-out-simple.svg"));
          mask: var(--icon-url-arrows-out-simple, url("/icons/arrows-out-simple.svg"));
}

.svg-arrows-out {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-out, url("/icons/arrows-out.svg"));
          mask: var(--icon-url-arrows-out, url("/icons/arrows-out.svg"));
}

.svg-arrows-split {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-split, url("/icons/arrows-split.svg"));
          mask: var(--icon-url-arrows-split, url("/icons/arrows-split.svg"));
}

.svg-arrows-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-arrows-vertical, url("/icons/arrows-vertical.svg"));
          mask: var(--icon-url-arrows-vertical, url("/icons/arrows-vertical.svg"));
}

.svg-article-medium {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-article-medium, url("/icons/article-medium.svg"));
          mask: var(--icon-url-article-medium, url("/icons/article-medium.svg"));
}

.svg-article-ny-times {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-article-ny-times, url("/icons/article-ny-times.svg"));
          mask: var(--icon-url-article-ny-times, url("/icons/article-ny-times.svg"));
}

.svg-article {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-article, url("/icons/article.svg"));
          mask: var(--icon-url-article, url("/icons/article.svg"));
}

.svg-asclepius {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-asclepius, url("/icons/asclepius.svg"));
          mask: var(--icon-url-asclepius, url("/icons/asclepius.svg"));
}

.svg-asterisk-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-asterisk-simple, url("/icons/asterisk-simple.svg"));
          mask: var(--icon-url-asterisk-simple, url("/icons/asterisk-simple.svg"));
}

.svg-asterisk {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-asterisk, url("/icons/asterisk.svg"));
          mask: var(--icon-url-asterisk, url("/icons/asterisk.svg"));
}

.svg-at {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-at, url("/icons/at.svg"));
          mask: var(--icon-url-at, url("/icons/at.svg"));
}

.svg-atom {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-atom, url("/icons/atom.svg"));
          mask: var(--icon-url-atom, url("/icons/atom.svg"));
}

.svg-avocado {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-avocado, url("/icons/avocado.svg"));
          mask: var(--icon-url-avocado, url("/icons/avocado.svg"));
}

.svg-axe {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-axe, url("/icons/axe.svg"));
          mask: var(--icon-url-axe, url("/icons/axe.svg"));
}

.svg-baby-carriage {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-baby-carriage, url("/icons/baby-carriage.svg"));
          mask: var(--icon-url-baby-carriage, url("/icons/baby-carriage.svg"));
}

.svg-baby {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-baby, url("/icons/baby.svg"));
          mask: var(--icon-url-baby, url("/icons/baby.svg"));
}

.svg-backpack {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-backpack, url("/icons/backpack.svg"));
          mask: var(--icon-url-backpack, url("/icons/backpack.svg"));
}

.svg-backspace {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-backspace, url("/icons/backspace.svg"));
          mask: var(--icon-url-backspace, url("/icons/backspace.svg"));
}

.svg-bag-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bag-simple, url("/icons/bag-simple.svg"));
          mask: var(--icon-url-bag-simple, url("/icons/bag-simple.svg"));
}

.svg-bag {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bag, url("/icons/bag.svg"));
          mask: var(--icon-url-bag, url("/icons/bag.svg"));
}

.svg-balloon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-balloon, url("/icons/balloon.svg"));
          mask: var(--icon-url-balloon, url("/icons/balloon.svg"));
}

.svg-bandaids {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bandaids, url("/icons/bandaids.svg"));
          mask: var(--icon-url-bandaids, url("/icons/bandaids.svg"));
}

.svg-bank {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bank, url("/icons/bank.svg"));
          mask: var(--icon-url-bank, url("/icons/bank.svg"));
}

.svg-barbell {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-barbell, url("/icons/barbell.svg"));
          mask: var(--icon-url-barbell, url("/icons/barbell.svg"));
}

.svg-barcode {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-barcode, url("/icons/barcode.svg"));
          mask: var(--icon-url-barcode, url("/icons/barcode.svg"));
}

.svg-barn {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-barn, url("/icons/barn.svg"));
          mask: var(--icon-url-barn, url("/icons/barn.svg"));
}

.svg-barricade {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-barricade, url("/icons/barricade.svg"));
          mask: var(--icon-url-barricade, url("/icons/barricade.svg"));
}

.svg-baseball-cap {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-baseball-cap, url("/icons/baseball-cap.svg"));
          mask: var(--icon-url-baseball-cap, url("/icons/baseball-cap.svg"));
}

.svg-baseball-helmet {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-baseball-helmet, url("/icons/baseball-helmet.svg"));
          mask: var(--icon-url-baseball-helmet, url("/icons/baseball-helmet.svg"));
}

.svg-baseball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-baseball, url("/icons/baseball.svg"));
          mask: var(--icon-url-baseball, url("/icons/baseball.svg"));
}

.svg-basket {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-basket, url("/icons/basket.svg"));
          mask: var(--icon-url-basket, url("/icons/basket.svg"));
}

.svg-basketball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-basketball, url("/icons/basketball.svg"));
          mask: var(--icon-url-basketball, url("/icons/basketball.svg"));
}

.svg-bathtub {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bathtub, url("/icons/bathtub.svg"));
          mask: var(--icon-url-bathtub, url("/icons/bathtub.svg"));
}

.svg-battery-charging-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-charging-vertical, url("/icons/battery-charging-vertical.svg"));
          mask: var(--icon-url-battery-charging-vertical, url("/icons/battery-charging-vertical.svg"));
}

.svg-battery-charging {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-charging, url("/icons/battery-charging.svg"));
          mask: var(--icon-url-battery-charging, url("/icons/battery-charging.svg"));
}

.svg-battery-empty {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-empty, url("/icons/battery-empty.svg"));
          mask: var(--icon-url-battery-empty, url("/icons/battery-empty.svg"));
}

.svg-battery-full {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-full, url("/icons/battery-full.svg"));
          mask: var(--icon-url-battery-full, url("/icons/battery-full.svg"));
}

.svg-battery-high {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-high, url("/icons/battery-high.svg"));
          mask: var(--icon-url-battery-high, url("/icons/battery-high.svg"));
}

.svg-battery-low {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-low, url("/icons/battery-low.svg"));
          mask: var(--icon-url-battery-low, url("/icons/battery-low.svg"));
}

.svg-battery-medium {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-medium, url("/icons/battery-medium.svg"));
          mask: var(--icon-url-battery-medium, url("/icons/battery-medium.svg"));
}

.svg-battery-plus-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-plus-vertical, url("/icons/battery-plus-vertical.svg"));
          mask: var(--icon-url-battery-plus-vertical, url("/icons/battery-plus-vertical.svg"));
}

.svg-battery-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-plus, url("/icons/battery-plus.svg"));
          mask: var(--icon-url-battery-plus, url("/icons/battery-plus.svg"));
}

.svg-battery-vertical-empty {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-vertical-empty, url("/icons/battery-vertical-empty.svg"));
          mask: var(--icon-url-battery-vertical-empty, url("/icons/battery-vertical-empty.svg"));
}

.svg-battery-vertical-full {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-vertical-full, url("/icons/battery-vertical-full.svg"));
          mask: var(--icon-url-battery-vertical-full, url("/icons/battery-vertical-full.svg"));
}

.svg-battery-vertical-high {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-vertical-high, url("/icons/battery-vertical-high.svg"));
          mask: var(--icon-url-battery-vertical-high, url("/icons/battery-vertical-high.svg"));
}

.svg-battery-vertical-low {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-vertical-low, url("/icons/battery-vertical-low.svg"));
          mask: var(--icon-url-battery-vertical-low, url("/icons/battery-vertical-low.svg"));
}

.svg-battery-vertical-medium {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-vertical-medium, url("/icons/battery-vertical-medium.svg"));
          mask: var(--icon-url-battery-vertical-medium, url("/icons/battery-vertical-medium.svg"));
}

.svg-battery-warning-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-warning-vertical, url("/icons/battery-warning-vertical.svg"));
          mask: var(--icon-url-battery-warning-vertical, url("/icons/battery-warning-vertical.svg"));
}

.svg-battery-warning {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-battery-warning, url("/icons/battery-warning.svg"));
          mask: var(--icon-url-battery-warning, url("/icons/battery-warning.svg"));
}

.svg-beach-ball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-beach-ball, url("/icons/beach-ball.svg"));
          mask: var(--icon-url-beach-ball, url("/icons/beach-ball.svg"));
}

.svg-beanie {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-beanie, url("/icons/beanie.svg"));
          mask: var(--icon-url-beanie, url("/icons/beanie.svg"));
}

.svg-bed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bed, url("/icons/bed.svg"));
          mask: var(--icon-url-bed, url("/icons/bed.svg"));
}

.svg-beer-bottle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-beer-bottle, url("/icons/beer-bottle.svg"));
          mask: var(--icon-url-beer-bottle, url("/icons/beer-bottle.svg"));
}

.svg-beer-stein {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-beer-stein, url("/icons/beer-stein.svg"));
          mask: var(--icon-url-beer-stein, url("/icons/beer-stein.svg"));
}

.svg-behance-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-behance-logo, url("/icons/behance-logo.svg"));
          mask: var(--icon-url-behance-logo, url("/icons/behance-logo.svg"));
}

.svg-bell-ringing {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bell-ringing, url("/icons/bell-ringing.svg"));
          mask: var(--icon-url-bell-ringing, url("/icons/bell-ringing.svg"));
}

.svg-bell-simple-ringing {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bell-simple-ringing, url("/icons/bell-simple-ringing.svg"));
          mask: var(--icon-url-bell-simple-ringing, url("/icons/bell-simple-ringing.svg"));
}

.svg-bell-simple-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bell-simple-slash, url("/icons/bell-simple-slash.svg"));
          mask: var(--icon-url-bell-simple-slash, url("/icons/bell-simple-slash.svg"));
}

.svg-bell-simple-z {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bell-simple-z, url("/icons/bell-simple-z.svg"));
          mask: var(--icon-url-bell-simple-z, url("/icons/bell-simple-z.svg"));
}

.svg-bell-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bell-simple, url("/icons/bell-simple.svg"));
          mask: var(--icon-url-bell-simple, url("/icons/bell-simple.svg"));
}

.svg-bell-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bell-slash, url("/icons/bell-slash.svg"));
          mask: var(--icon-url-bell-slash, url("/icons/bell-slash.svg"));
}

.svg-bell-z {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bell-z, url("/icons/bell-z.svg"));
          mask: var(--icon-url-bell-z, url("/icons/bell-z.svg"));
}

.svg-bell {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bell, url("/icons/bell.svg"));
          mask: var(--icon-url-bell, url("/icons/bell.svg"));
}

.svg-belt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-belt, url("/icons/belt.svg"));
          mask: var(--icon-url-belt, url("/icons/belt.svg"));
}

.svg-bezier-curve {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bezier-curve, url("/icons/bezier-curve.svg"));
          mask: var(--icon-url-bezier-curve, url("/icons/bezier-curve.svg"));
}

.svg-bicycle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bicycle, url("/icons/bicycle.svg"));
          mask: var(--icon-url-bicycle, url("/icons/bicycle.svg"));
}

.svg-binary {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-binary, url("/icons/binary.svg"));
          mask: var(--icon-url-binary, url("/icons/binary.svg"));
}

.svg-binoculars {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-binoculars, url("/icons/binoculars.svg"));
          mask: var(--icon-url-binoculars, url("/icons/binoculars.svg"));
}

.svg-biohazard {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-biohazard, url("/icons/biohazard.svg"));
          mask: var(--icon-url-biohazard, url("/icons/biohazard.svg"));
}

.svg-bird {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bird, url("/icons/bird.svg"));
          mask: var(--icon-url-bird, url("/icons/bird.svg"));
}

.svg-blueprint {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-blueprint, url("/icons/blueprint.svg"));
          mask: var(--icon-url-blueprint, url("/icons/blueprint.svg"));
}

.svg-bluetooth-connected {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bluetooth-connected, url("/icons/bluetooth-connected.svg"));
          mask: var(--icon-url-bluetooth-connected, url("/icons/bluetooth-connected.svg"));
}

.svg-bluetooth-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bluetooth-slash, url("/icons/bluetooth-slash.svg"));
          mask: var(--icon-url-bluetooth-slash, url("/icons/bluetooth-slash.svg"));
}

.svg-bluetooth-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bluetooth-x, url("/icons/bluetooth-x.svg"));
          mask: var(--icon-url-bluetooth-x, url("/icons/bluetooth-x.svg"));
}

.svg-bluetooth {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bluetooth, url("/icons/bluetooth.svg"));
          mask: var(--icon-url-bluetooth, url("/icons/bluetooth.svg"));
}

.svg-boat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-boat, url("/icons/boat.svg"));
          mask: var(--icon-url-boat, url("/icons/boat.svg"));
}

.svg-bomb {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bomb, url("/icons/bomb.svg"));
          mask: var(--icon-url-bomb, url("/icons/bomb.svg"));
}

.svg-bone {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bone, url("/icons/bone.svg"));
          mask: var(--icon-url-bone, url("/icons/bone.svg"));
}

.svg-book-bookmark {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-book-bookmark, url("/icons/book-bookmark.svg"));
          mask: var(--icon-url-book-bookmark, url("/icons/book-bookmark.svg"));
}

.svg-book-open-text {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-book-open-text, url("/icons/book-open-text.svg"));
          mask: var(--icon-url-book-open-text, url("/icons/book-open-text.svg"));
}

.svg-book-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-book-open, url("/icons/book-open.svg"));
          mask: var(--icon-url-book-open, url("/icons/book-open.svg"));
}

.svg-book-user {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-book-user, url("/icons/book-user.svg"));
          mask: var(--icon-url-book-user, url("/icons/book-user.svg"));
}

.svg-book {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-book, url("/icons/book.svg"));
          mask: var(--icon-url-book, url("/icons/book.svg"));
}

.svg-bookmark-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bookmark-simple, url("/icons/bookmark-simple.svg"));
          mask: var(--icon-url-bookmark-simple, url("/icons/bookmark-simple.svg"));
}

.svg-bookmark {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bookmark, url("/icons/bookmark.svg"));
          mask: var(--icon-url-bookmark, url("/icons/bookmark.svg"));
}

.svg-bookmarks-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bookmarks-simple, url("/icons/bookmarks-simple.svg"));
          mask: var(--icon-url-bookmarks-simple, url("/icons/bookmarks-simple.svg"));
}

.svg-bookmarks {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bookmarks, url("/icons/bookmarks.svg"));
          mask: var(--icon-url-bookmarks, url("/icons/bookmarks.svg"));
}

.svg-books {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-books, url("/icons/books.svg"));
          mask: var(--icon-url-books, url("/icons/books.svg"));
}

.svg-boot {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-boot, url("/icons/boot.svg"));
          mask: var(--icon-url-boot, url("/icons/boot.svg"));
}

.svg-boules {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-boules, url("/icons/boules.svg"));
          mask: var(--icon-url-boules, url("/icons/boules.svg"));
}

.svg-bounding-box {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bounding-box, url("/icons/bounding-box.svg"));
          mask: var(--icon-url-bounding-box, url("/icons/bounding-box.svg"));
}

.svg-bowl-food {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bowl-food, url("/icons/bowl-food.svg"));
          mask: var(--icon-url-bowl-food, url("/icons/bowl-food.svg"));
}

.svg-bowl-steam {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bowl-steam, url("/icons/bowl-steam.svg"));
          mask: var(--icon-url-bowl-steam, url("/icons/bowl-steam.svg"));
}

.svg-bowling-ball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bowling-ball, url("/icons/bowling-ball.svg"));
          mask: var(--icon-url-bowling-ball, url("/icons/bowling-ball.svg"));
}

.svg-box-arrow-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-box-arrow-down, url("/icons/box-arrow-down.svg"));
          mask: var(--icon-url-box-arrow-down, url("/icons/box-arrow-down.svg"));
}

.svg-box-arrow-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-box-arrow-up, url("/icons/box-arrow-up.svg"));
          mask: var(--icon-url-box-arrow-up, url("/icons/box-arrow-up.svg"));
}

.svg-boxing-glove {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-boxing-glove, url("/icons/boxing-glove.svg"));
          mask: var(--icon-url-boxing-glove, url("/icons/boxing-glove.svg"));
}

.svg-brackets-angle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-brackets-angle, url("/icons/brackets-angle.svg"));
          mask: var(--icon-url-brackets-angle, url("/icons/brackets-angle.svg"));
}

.svg-brackets-curly {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-brackets-curly, url("/icons/brackets-curly.svg"));
          mask: var(--icon-url-brackets-curly, url("/icons/brackets-curly.svg"));
}

.svg-brackets-round {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-brackets-round, url("/icons/brackets-round.svg"));
          mask: var(--icon-url-brackets-round, url("/icons/brackets-round.svg"));
}

.svg-brackets-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-brackets-square, url("/icons/brackets-square.svg"));
          mask: var(--icon-url-brackets-square, url("/icons/brackets-square.svg"));
}

.svg-brain {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-brain, url("/icons/brain.svg"));
          mask: var(--icon-url-brain, url("/icons/brain.svg"));
}

.svg-brandy {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-brandy, url("/icons/brandy.svg"));
          mask: var(--icon-url-brandy, url("/icons/brandy.svg"));
}

.svg-bread {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bread, url("/icons/bread.svg"));
          mask: var(--icon-url-bread, url("/icons/bread.svg"));
}

.svg-bridge {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bridge, url("/icons/bridge.svg"));
          mask: var(--icon-url-bridge, url("/icons/bridge.svg"));
}

.svg-briefcase-metal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-briefcase-metal, url("/icons/briefcase-metal.svg"));
          mask: var(--icon-url-briefcase-metal, url("/icons/briefcase-metal.svg"));
}

.svg-briefcase {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-briefcase, url("/icons/briefcase.svg"));
          mask: var(--icon-url-briefcase, url("/icons/briefcase.svg"));
}

.svg-broadcast {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-broadcast, url("/icons/broadcast.svg"));
          mask: var(--icon-url-broadcast, url("/icons/broadcast.svg"));
}

.svg-broom {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-broom, url("/icons/broom.svg"));
          mask: var(--icon-url-broom, url("/icons/broom.svg"));
}

.svg-browser {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-browser, url("/icons/browser.svg"));
          mask: var(--icon-url-browser, url("/icons/browser.svg"));
}

.svg-browsers {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-browsers, url("/icons/browsers.svg"));
          mask: var(--icon-url-browsers, url("/icons/browsers.svg"));
}

.svg-bug-beetle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bug-beetle, url("/icons/bug-beetle.svg"));
          mask: var(--icon-url-bug-beetle, url("/icons/bug-beetle.svg"));
}

.svg-bug-droid {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bug-droid, url("/icons/bug-droid.svg"));
          mask: var(--icon-url-bug-droid, url("/icons/bug-droid.svg"));
}

.svg-bug {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bug, url("/icons/bug.svg"));
          mask: var(--icon-url-bug, url("/icons/bug.svg"));
}

.svg-building-apartment {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-building-apartment, url("/icons/building-apartment.svg"));
          mask: var(--icon-url-building-apartment, url("/icons/building-apartment.svg"));
}

.svg-building-office {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-building-office, url("/icons/building-office.svg"));
          mask: var(--icon-url-building-office, url("/icons/building-office.svg"));
}

.svg-building {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-building, url("/icons/building.svg"));
          mask: var(--icon-url-building, url("/icons/building.svg"));
}

.svg-buildings {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-buildings, url("/icons/buildings.svg"));
          mask: var(--icon-url-buildings, url("/icons/buildings.svg"));
}

.svg-bulldozer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bulldozer, url("/icons/bulldozer.svg"));
          mask: var(--icon-url-bulldozer, url("/icons/bulldozer.svg"));
}

.svg-bus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-bus, url("/icons/bus.svg"));
          mask: var(--icon-url-bus, url("/icons/bus.svg"));
}

.svg-butterfly {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-butterfly, url("/icons/butterfly.svg"));
          mask: var(--icon-url-butterfly, url("/icons/butterfly.svg"));
}

.svg-cable-car {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cable-car, url("/icons/cable-car.svg"));
          mask: var(--icon-url-cable-car, url("/icons/cable-car.svg"));
}

.svg-cactus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cactus, url("/icons/cactus.svg"));
          mask: var(--icon-url-cactus, url("/icons/cactus.svg"));
}

.svg-cake {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cake, url("/icons/cake.svg"));
          mask: var(--icon-url-cake, url("/icons/cake.svg"));
}

.svg-calculator {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calculator, url("/icons/calculator.svg"));
          mask: var(--icon-url-calculator, url("/icons/calculator.svg"));
}

.svg-calendar-blank {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-blank, url("/icons/calendar-blank.svg"));
          mask: var(--icon-url-calendar-blank, url("/icons/calendar-blank.svg"));
}

.svg-calendar-check {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-check, url("/icons/calendar-check.svg"));
          mask: var(--icon-url-calendar-check, url("/icons/calendar-check.svg"));
}

.svg-calendar-dot {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-dot, url("/icons/calendar-dot.svg"));
          mask: var(--icon-url-calendar-dot, url("/icons/calendar-dot.svg"));
}

.svg-calendar-dots {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-dots, url("/icons/calendar-dots.svg"));
          mask: var(--icon-url-calendar-dots, url("/icons/calendar-dots.svg"));
}

.svg-calendar-heart {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-heart, url("/icons/calendar-heart.svg"));
          mask: var(--icon-url-calendar-heart, url("/icons/calendar-heart.svg"));
}

.svg-calendar-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-minus, url("/icons/calendar-minus.svg"));
          mask: var(--icon-url-calendar-minus, url("/icons/calendar-minus.svg"));
}

.svg-calendar-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-plus, url("/icons/calendar-plus.svg"));
          mask: var(--icon-url-calendar-plus, url("/icons/calendar-plus.svg"));
}

.svg-calendar-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-slash, url("/icons/calendar-slash.svg"));
          mask: var(--icon-url-calendar-slash, url("/icons/calendar-slash.svg"));
}

.svg-calendar-star {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-star, url("/icons/calendar-star.svg"));
          mask: var(--icon-url-calendar-star, url("/icons/calendar-star.svg"));
}

.svg-calendar-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar-x, url("/icons/calendar-x.svg"));
          mask: var(--icon-url-calendar-x, url("/icons/calendar-x.svg"));
}

.svg-calendar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-calendar, url("/icons/calendar.svg"));
          mask: var(--icon-url-calendar, url("/icons/calendar.svg"));
}

.svg-call-bell {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-call-bell, url("/icons/call-bell.svg"));
          mask: var(--icon-url-call-bell, url("/icons/call-bell.svg"));
}

.svg-camera-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-camera-plus, url("/icons/camera-plus.svg"));
          mask: var(--icon-url-camera-plus, url("/icons/camera-plus.svg"));
}

.svg-camera-rotate {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-camera-rotate, url("/icons/camera-rotate.svg"));
          mask: var(--icon-url-camera-rotate, url("/icons/camera-rotate.svg"));
}

.svg-camera-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-camera-slash, url("/icons/camera-slash.svg"));
          mask: var(--icon-url-camera-slash, url("/icons/camera-slash.svg"));
}

.svg-camera {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-camera, url("/icons/camera.svg"));
          mask: var(--icon-url-camera, url("/icons/camera.svg"));
}

.svg-campfire {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-campfire, url("/icons/campfire.svg"));
          mask: var(--icon-url-campfire, url("/icons/campfire.svg"));
}

.svg-car-battery {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-car-battery, url("/icons/car-battery.svg"));
          mask: var(--icon-url-car-battery, url("/icons/car-battery.svg"));
}

.svg-car-profile {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-car-profile, url("/icons/car-profile.svg"));
          mask: var(--icon-url-car-profile, url("/icons/car-profile.svg"));
}

.svg-car-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-car-simple, url("/icons/car-simple.svg"));
          mask: var(--icon-url-car-simple, url("/icons/car-simple.svg"));
}

.svg-car {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-car, url("/icons/car.svg"));
          mask: var(--icon-url-car, url("/icons/car.svg"));
}

.svg-cardholder {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cardholder, url("/icons/cardholder.svg"));
          mask: var(--icon-url-cardholder, url("/icons/cardholder.svg"));
}

.svg-cards-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cards-three, url("/icons/cards-three.svg"));
          mask: var(--icon-url-cards-three, url("/icons/cards-three.svg"));
}

.svg-cards {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cards, url("/icons/cards.svg"));
          mask: var(--icon-url-cards, url("/icons/cards.svg"));
}

.svg-caret-circle-double-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-double-down, url("/icons/caret-circle-double-down.svg"));
          mask: var(--icon-url-caret-circle-double-down, url("/icons/caret-circle-double-down.svg"));
}

.svg-caret-circle-double-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-double-left, url("/icons/caret-circle-double-left.svg"));
          mask: var(--icon-url-caret-circle-double-left, url("/icons/caret-circle-double-left.svg"));
}

.svg-caret-circle-double-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-double-right, url("/icons/caret-circle-double-right.svg"));
          mask: var(--icon-url-caret-circle-double-right, url("/icons/caret-circle-double-right.svg"));
}

.svg-caret-circle-double-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-double-up, url("/icons/caret-circle-double-up.svg"));
          mask: var(--icon-url-caret-circle-double-up, url("/icons/caret-circle-double-up.svg"));
}

.svg-caret-circle-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-down, url("/icons/caret-circle-down.svg"));
          mask: var(--icon-url-caret-circle-down, url("/icons/caret-circle-down.svg"));
}

.svg-caret-circle-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-left, url("/icons/caret-circle-left.svg"));
          mask: var(--icon-url-caret-circle-left, url("/icons/caret-circle-left.svg"));
}

.svg-caret-circle-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-right, url("/icons/caret-circle-right.svg"));
          mask: var(--icon-url-caret-circle-right, url("/icons/caret-circle-right.svg"));
}

.svg-caret-circle-up-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-up-down, url("/icons/caret-circle-up-down.svg"));
          mask: var(--icon-url-caret-circle-up-down, url("/icons/caret-circle-up-down.svg"));
}

.svg-caret-circle-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-circle-up, url("/icons/caret-circle-up.svg"));
          mask: var(--icon-url-caret-circle-up, url("/icons/caret-circle-up.svg"));
}

.svg-caret-double-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-double-down, url("/icons/caret-double-down.svg"));
          mask: var(--icon-url-caret-double-down, url("/icons/caret-double-down.svg"));
}

.svg-caret-double-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-double-left, url("/icons/caret-double-left.svg"));
          mask: var(--icon-url-caret-double-left, url("/icons/caret-double-left.svg"));
}

.svg-caret-double-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-double-right, url("/icons/caret-double-right.svg"));
          mask: var(--icon-url-caret-double-right, url("/icons/caret-double-right.svg"));
}

.svg-caret-double-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-double-up, url("/icons/caret-double-up.svg"));
          mask: var(--icon-url-caret-double-up, url("/icons/caret-double-up.svg"));
}

.svg-caret-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-down, url("/icons/caret-down.svg"));
          mask: var(--icon-url-caret-down, url("/icons/caret-down.svg"));
}

.svg-caret-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-left, url("/icons/caret-left.svg"));
          mask: var(--icon-url-caret-left, url("/icons/caret-left.svg"));
}

.svg-caret-line-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-line-down, url("/icons/caret-line-down.svg"));
          mask: var(--icon-url-caret-line-down, url("/icons/caret-line-down.svg"));
}

.svg-caret-line-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-line-left, url("/icons/caret-line-left.svg"));
          mask: var(--icon-url-caret-line-left, url("/icons/caret-line-left.svg"));
}

.svg-caret-line-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-line-right, url("/icons/caret-line-right.svg"));
          mask: var(--icon-url-caret-line-right, url("/icons/caret-line-right.svg"));
}

.svg-caret-line-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-line-up, url("/icons/caret-line-up.svg"));
          mask: var(--icon-url-caret-line-up, url("/icons/caret-line-up.svg"));
}

.svg-caret-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-right, url("/icons/caret-right.svg"));
          mask: var(--icon-url-caret-right, url("/icons/caret-right.svg"));
}

.svg-caret-up-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-up-down, url("/icons/caret-up-down.svg"));
          mask: var(--icon-url-caret-up-down, url("/icons/caret-up-down.svg"));
}

.svg-caret-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-caret-up, url("/icons/caret-up.svg"));
          mask: var(--icon-url-caret-up, url("/icons/caret-up.svg"));
}

.svg-carrot {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-carrot, url("/icons/carrot.svg"));
          mask: var(--icon-url-carrot, url("/icons/carrot.svg"));
}

.svg-cash-register {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cash-register, url("/icons/cash-register.svg"));
          mask: var(--icon-url-cash-register, url("/icons/cash-register.svg"));
}

.svg-cassette-tape {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cassette-tape, url("/icons/cassette-tape.svg"));
          mask: var(--icon-url-cassette-tape, url("/icons/cassette-tape.svg"));
}

.svg-castle-turret {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-castle-turret, url("/icons/castle-turret.svg"));
          mask: var(--icon-url-castle-turret, url("/icons/castle-turret.svg"));
}

.svg-cat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cat, url("/icons/cat.svg"));
          mask: var(--icon-url-cat, url("/icons/cat.svg"));
}

.svg-cell-signal-full {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cell-signal-full, url("/icons/cell-signal-full.svg"));
          mask: var(--icon-url-cell-signal-full, url("/icons/cell-signal-full.svg"));
}

.svg-cell-signal-high {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cell-signal-high, url("/icons/cell-signal-high.svg"));
          mask: var(--icon-url-cell-signal-high, url("/icons/cell-signal-high.svg"));
}

.svg-cell-signal-low {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cell-signal-low, url("/icons/cell-signal-low.svg"));
          mask: var(--icon-url-cell-signal-low, url("/icons/cell-signal-low.svg"));
}

.svg-cell-signal-medium {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cell-signal-medium, url("/icons/cell-signal-medium.svg"));
          mask: var(--icon-url-cell-signal-medium, url("/icons/cell-signal-medium.svg"));
}

.svg-cell-signal-none {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cell-signal-none, url("/icons/cell-signal-none.svg"));
          mask: var(--icon-url-cell-signal-none, url("/icons/cell-signal-none.svg"));
}

.svg-cell-signal-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cell-signal-slash, url("/icons/cell-signal-slash.svg"));
          mask: var(--icon-url-cell-signal-slash, url("/icons/cell-signal-slash.svg"));
}

.svg-cell-signal-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cell-signal-x, url("/icons/cell-signal-x.svg"));
          mask: var(--icon-url-cell-signal-x, url("/icons/cell-signal-x.svg"));
}

.svg-cell-tower {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cell-tower, url("/icons/cell-tower.svg"));
          mask: var(--icon-url-cell-tower, url("/icons/cell-tower.svg"));
}

.svg-certificate {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-certificate, url("/icons/certificate.svg"));
          mask: var(--icon-url-certificate, url("/icons/certificate.svg"));
}

.svg-chair {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chair, url("/icons/chair.svg"));
          mask: var(--icon-url-chair, url("/icons/chair.svg"));
}

.svg-chalkboard-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chalkboard-simple, url("/icons/chalkboard-simple.svg"));
          mask: var(--icon-url-chalkboard-simple, url("/icons/chalkboard-simple.svg"));
}

.svg-chalkboard-teacher {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chalkboard-teacher, url("/icons/chalkboard-teacher.svg"));
          mask: var(--icon-url-chalkboard-teacher, url("/icons/chalkboard-teacher.svg"));
}

.svg-chalkboard {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chalkboard, url("/icons/chalkboard.svg"));
          mask: var(--icon-url-chalkboard, url("/icons/chalkboard.svg"));
}

.svg-champagne {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-champagne, url("/icons/champagne.svg"));
          mask: var(--icon-url-champagne, url("/icons/champagne.svg"));
}

.svg-charging-station {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-charging-station, url("/icons/charging-station.svg"));
          mask: var(--icon-url-charging-station, url("/icons/charging-station.svg"));
}

.svg-chart-bar-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-bar-horizontal, url("/icons/chart-bar-horizontal.svg"));
          mask: var(--icon-url-chart-bar-horizontal, url("/icons/chart-bar-horizontal.svg"));
}

.svg-chart-bar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-bar, url("/icons/chart-bar.svg"));
          mask: var(--icon-url-chart-bar, url("/icons/chart-bar.svg"));
}

.svg-chart-donut {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-donut, url("/icons/chart-donut.svg"));
          mask: var(--icon-url-chart-donut, url("/icons/chart-donut.svg"));
}

.svg-chart-line-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-line-down, url("/icons/chart-line-down.svg"));
          mask: var(--icon-url-chart-line-down, url("/icons/chart-line-down.svg"));
}

.svg-chart-line-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-line-up, url("/icons/chart-line-up.svg"));
          mask: var(--icon-url-chart-line-up, url("/icons/chart-line-up.svg"));
}

.svg-chart-line {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-line, url("/icons/chart-line.svg"));
          mask: var(--icon-url-chart-line, url("/icons/chart-line.svg"));
}

.svg-chart-pie-slice {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-pie-slice, url("/icons/chart-pie-slice.svg"));
          mask: var(--icon-url-chart-pie-slice, url("/icons/chart-pie-slice.svg"));
}

.svg-chart-pie {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-pie, url("/icons/chart-pie.svg"));
          mask: var(--icon-url-chart-pie, url("/icons/chart-pie.svg"));
}

.svg-chart-polar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-polar, url("/icons/chart-polar.svg"));
          mask: var(--icon-url-chart-polar, url("/icons/chart-polar.svg"));
}

.svg-chart-scatter {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chart-scatter, url("/icons/chart-scatter.svg"));
          mask: var(--icon-url-chart-scatter, url("/icons/chart-scatter.svg"));
}

.svg-chat-centered-dots {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-centered-dots, url("/icons/chat-centered-dots.svg"));
          mask: var(--icon-url-chat-centered-dots, url("/icons/chat-centered-dots.svg"));
}

.svg-chat-centered-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-centered-slash, url("/icons/chat-centered-slash.svg"));
          mask: var(--icon-url-chat-centered-slash, url("/icons/chat-centered-slash.svg"));
}

.svg-chat-centered-text {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-centered-text, url("/icons/chat-centered-text.svg"));
          mask: var(--icon-url-chat-centered-text, url("/icons/chat-centered-text.svg"));
}

.svg-chat-centered {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-centered, url("/icons/chat-centered.svg"));
          mask: var(--icon-url-chat-centered, url("/icons/chat-centered.svg"));
}

.svg-chat-circle-dots {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-circle-dots, url("/icons/chat-circle-dots.svg"));
          mask: var(--icon-url-chat-circle-dots, url("/icons/chat-circle-dots.svg"));
}

.svg-chat-circle-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-circle-slash, url("/icons/chat-circle-slash.svg"));
          mask: var(--icon-url-chat-circle-slash, url("/icons/chat-circle-slash.svg"));
}

.svg-chat-circle-text {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-circle-text, url("/icons/chat-circle-text.svg"));
          mask: var(--icon-url-chat-circle-text, url("/icons/chat-circle-text.svg"));
}

.svg-chat-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-circle, url("/icons/chat-circle.svg"));
          mask: var(--icon-url-chat-circle, url("/icons/chat-circle.svg"));
}

.svg-chat-dots {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-dots, url("/icons/chat-dots.svg"));
          mask: var(--icon-url-chat-dots, url("/icons/chat-dots.svg"));
}

.svg-chat-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-slash, url("/icons/chat-slash.svg"));
          mask: var(--icon-url-chat-slash, url("/icons/chat-slash.svg"));
}

.svg-chat-teardrop-dots {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-teardrop-dots, url("/icons/chat-teardrop-dots.svg"));
          mask: var(--icon-url-chat-teardrop-dots, url("/icons/chat-teardrop-dots.svg"));
}

.svg-chat-teardrop-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-teardrop-slash, url("/icons/chat-teardrop-slash.svg"));
          mask: var(--icon-url-chat-teardrop-slash, url("/icons/chat-teardrop-slash.svg"));
}

.svg-chat-teardrop-text {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-teardrop-text, url("/icons/chat-teardrop-text.svg"));
          mask: var(--icon-url-chat-teardrop-text, url("/icons/chat-teardrop-text.svg"));
}

.svg-chat-teardrop {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-teardrop, url("/icons/chat-teardrop.svg"));
          mask: var(--icon-url-chat-teardrop, url("/icons/chat-teardrop.svg"));
}

.svg-chat-text {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat-text, url("/icons/chat-text.svg"));
          mask: var(--icon-url-chat-text, url("/icons/chat-text.svg"));
}

.svg-chat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chat, url("/icons/chat.svg"));
          mask: var(--icon-url-chat, url("/icons/chat.svg"));
}

.svg-chats-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chats-circle, url("/icons/chats-circle.svg"));
          mask: var(--icon-url-chats-circle, url("/icons/chats-circle.svg"));
}

.svg-chats-teardrop {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chats-teardrop, url("/icons/chats-teardrop.svg"));
          mask: var(--icon-url-chats-teardrop, url("/icons/chats-teardrop.svg"));
}

.svg-chats {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chats, url("/icons/chats.svg"));
          mask: var(--icon-url-chats, url("/icons/chats.svg"));
}

.svg-check-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-check-circle, url("/icons/check-circle.svg"));
          mask: var(--icon-url-check-circle, url("/icons/check-circle.svg"));
}

.svg-check-fat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-check-fat, url("/icons/check-fat.svg"));
          mask: var(--icon-url-check-fat, url("/icons/check-fat.svg"));
}

.svg-check-square-offset {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-check-square-offset, url("/icons/check-square-offset.svg"));
          mask: var(--icon-url-check-square-offset, url("/icons/check-square-offset.svg"));
}

.svg-check-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-check-square, url("/icons/check-square.svg"));
          mask: var(--icon-url-check-square, url("/icons/check-square.svg"));
}

.svg-check {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-check, url("/icons/check.svg"));
          mask: var(--icon-url-check, url("/icons/check.svg"));
}

.svg-checkerboard {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-checkerboard, url("/icons/checkerboard.svg"));
          mask: var(--icon-url-checkerboard, url("/icons/checkerboard.svg"));
}

.svg-checks {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-checks, url("/icons/checks.svg"));
          mask: var(--icon-url-checks, url("/icons/checks.svg"));
}

.svg-cheers {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cheers, url("/icons/cheers.svg"));
          mask: var(--icon-url-cheers, url("/icons/cheers.svg"));
}

.svg-cheese {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cheese, url("/icons/cheese.svg"));
          mask: var(--icon-url-cheese, url("/icons/cheese.svg"));
}

.svg-chef-hat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-chef-hat, url("/icons/chef-hat.svg"));
          mask: var(--icon-url-chef-hat, url("/icons/chef-hat.svg"));
}

.svg-cherries {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cherries, url("/icons/cherries.svg"));
          mask: var(--icon-url-cherries, url("/icons/cherries.svg"));
}

.svg-church {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-church, url("/icons/church.svg"));
          mask: var(--icon-url-church, url("/icons/church.svg"));
}

.svg-cigarette-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cigarette-slash, url("/icons/cigarette-slash.svg"));
          mask: var(--icon-url-cigarette-slash, url("/icons/cigarette-slash.svg"));
}

.svg-cigarette {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cigarette, url("/icons/cigarette.svg"));
          mask: var(--icon-url-cigarette, url("/icons/cigarette.svg"));
}

.svg-circle-dashed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circle-dashed, url("/icons/circle-dashed.svg"));
          mask: var(--icon-url-circle-dashed, url("/icons/circle-dashed.svg"));
}

.svg-circle-half-tilt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circle-half-tilt, url("/icons/circle-half-tilt.svg"));
          mask: var(--icon-url-circle-half-tilt, url("/icons/circle-half-tilt.svg"));
}

.svg-circle-half {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circle-half, url("/icons/circle-half.svg"));
          mask: var(--icon-url-circle-half, url("/icons/circle-half.svg"));
}

.svg-circle-notch {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circle-notch, url("/icons/circle-notch.svg"));
          mask: var(--icon-url-circle-notch, url("/icons/circle-notch.svg"));
}

.svg-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circle, url("/icons/circle.svg"));
          mask: var(--icon-url-circle, url("/icons/circle.svg"));
}

.svg-circles-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circles-four, url("/icons/circles-four.svg"));
          mask: var(--icon-url-circles-four, url("/icons/circles-four.svg"));
}

.svg-circles-three-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circles-three-plus, url("/icons/circles-three-plus.svg"));
          mask: var(--icon-url-circles-three-plus, url("/icons/circles-three-plus.svg"));
}

.svg-circles-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circles-three, url("/icons/circles-three.svg"));
          mask: var(--icon-url-circles-three, url("/icons/circles-three.svg"));
}

.svg-circuitry {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-circuitry, url("/icons/circuitry.svg"));
          mask: var(--icon-url-circuitry, url("/icons/circuitry.svg"));
}

.svg-city {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-city, url("/icons/city.svg"));
          mask: var(--icon-url-city, url("/icons/city.svg"));
}

.svg-clipboard-text {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clipboard-text, url("/icons/clipboard-text.svg"));
          mask: var(--icon-url-clipboard-text, url("/icons/clipboard-text.svg"));
}

.svg-clipboard {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clipboard, url("/icons/clipboard.svg"));
          mask: var(--icon-url-clipboard, url("/icons/clipboard.svg"));
}

.svg-clock-afternoon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clock-afternoon, url("/icons/clock-afternoon.svg"));
          mask: var(--icon-url-clock-afternoon, url("/icons/clock-afternoon.svg"));
}

.svg-clock-clockwise {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clock-clockwise, url("/icons/clock-clockwise.svg"));
          mask: var(--icon-url-clock-clockwise, url("/icons/clock-clockwise.svg"));
}

.svg-clock-countdown {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clock-countdown, url("/icons/clock-countdown.svg"));
          mask: var(--icon-url-clock-countdown, url("/icons/clock-countdown.svg"));
}

.svg-clock-counter-clockwise {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clock-counter-clockwise, url("/icons/clock-counter-clockwise.svg"));
          mask: var(--icon-url-clock-counter-clockwise, url("/icons/clock-counter-clockwise.svg"));
}

.svg-clock-user {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clock-user, url("/icons/clock-user.svg"));
          mask: var(--icon-url-clock-user, url("/icons/clock-user.svg"));
}

.svg-clock {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clock, url("/icons/clock.svg"));
          mask: var(--icon-url-clock, url("/icons/clock.svg"));
}

.svg-closed-captioning {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-closed-captioning, url("/icons/closed-captioning.svg"));
          mask: var(--icon-url-closed-captioning, url("/icons/closed-captioning.svg"));
}

.svg-cloud-arrow-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-arrow-down, url("/icons/cloud-arrow-down.svg"));
          mask: var(--icon-url-cloud-arrow-down, url("/icons/cloud-arrow-down.svg"));
}

.svg-cloud-arrow-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-arrow-up, url("/icons/cloud-arrow-up.svg"));
          mask: var(--icon-url-cloud-arrow-up, url("/icons/cloud-arrow-up.svg"));
}

.svg-cloud-check {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-check, url("/icons/cloud-check.svg"));
          mask: var(--icon-url-cloud-check, url("/icons/cloud-check.svg"));
}

.svg-cloud-fog {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-fog, url("/icons/cloud-fog.svg"));
          mask: var(--icon-url-cloud-fog, url("/icons/cloud-fog.svg"));
}

.svg-cloud-lightning {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-lightning, url("/icons/cloud-lightning.svg"));
          mask: var(--icon-url-cloud-lightning, url("/icons/cloud-lightning.svg"));
}

.svg-cloud-moon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-moon, url("/icons/cloud-moon.svg"));
          mask: var(--icon-url-cloud-moon, url("/icons/cloud-moon.svg"));
}

.svg-cloud-rain {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-rain, url("/icons/cloud-rain.svg"));
          mask: var(--icon-url-cloud-rain, url("/icons/cloud-rain.svg"));
}

.svg-cloud-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-slash, url("/icons/cloud-slash.svg"));
          mask: var(--icon-url-cloud-slash, url("/icons/cloud-slash.svg"));
}

.svg-cloud-snow {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-snow, url("/icons/cloud-snow.svg"));
          mask: var(--icon-url-cloud-snow, url("/icons/cloud-snow.svg"));
}

.svg-cloud-sun {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-sun, url("/icons/cloud-sun.svg"));
          mask: var(--icon-url-cloud-sun, url("/icons/cloud-sun.svg"));
}

.svg-cloud-warning {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-warning, url("/icons/cloud-warning.svg"));
          mask: var(--icon-url-cloud-warning, url("/icons/cloud-warning.svg"));
}

.svg-cloud-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud-x, url("/icons/cloud-x.svg"));
          mask: var(--icon-url-cloud-x, url("/icons/cloud-x.svg"));
}

.svg-cloud {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cloud, url("/icons/cloud.svg"));
          mask: var(--icon-url-cloud, url("/icons/cloud.svg"));
}

.svg-clover {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-clover, url("/icons/clover.svg"));
          mask: var(--icon-url-clover, url("/icons/clover.svg"));
}

.svg-club {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-club, url("/icons/club.svg"));
          mask: var(--icon-url-club, url("/icons/club.svg"));
}

.svg-coat-hanger {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-coat-hanger, url("/icons/coat-hanger.svg"));
          mask: var(--icon-url-coat-hanger, url("/icons/coat-hanger.svg"));
}

.svg-coda-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-coda-logo, url("/icons/coda-logo.svg"));
          mask: var(--icon-url-coda-logo, url("/icons/coda-logo.svg"));
}

.svg-code-block {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-code-block, url("/icons/code-block.svg"));
          mask: var(--icon-url-code-block, url("/icons/code-block.svg"));
}

.svg-code-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-code-simple, url("/icons/code-simple.svg"));
          mask: var(--icon-url-code-simple, url("/icons/code-simple.svg"));
}

.svg-code {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-code, url("/icons/code.svg"));
          mask: var(--icon-url-code, url("/icons/code.svg"));
}

.svg-codepen-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-codepen-logo, url("/icons/codepen-logo.svg"));
          mask: var(--icon-url-codepen-logo, url("/icons/codepen-logo.svg"));
}

.svg-codesandbox-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-codesandbox-logo, url("/icons/codesandbox-logo.svg"));
          mask: var(--icon-url-codesandbox-logo, url("/icons/codesandbox-logo.svg"));
}

.svg-coffee-bean {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-coffee-bean, url("/icons/coffee-bean.svg"));
          mask: var(--icon-url-coffee-bean, url("/icons/coffee-bean.svg"));
}

.svg-coffee {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-coffee, url("/icons/coffee.svg"));
          mask: var(--icon-url-coffee, url("/icons/coffee.svg"));
}

.svg-coin-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-coin-vertical, url("/icons/coin-vertical.svg"));
          mask: var(--icon-url-coin-vertical, url("/icons/coin-vertical.svg"));
}

.svg-coin {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-coin, url("/icons/coin.svg"));
          mask: var(--icon-url-coin, url("/icons/coin.svg"));
}

.svg-coins {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-coins, url("/icons/coins.svg"));
          mask: var(--icon-url-coins, url("/icons/coins.svg"));
}

.svg-columns-plus-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-columns-plus-left, url("/icons/columns-plus-left.svg"));
          mask: var(--icon-url-columns-plus-left, url("/icons/columns-plus-left.svg"));
}

.svg-columns-plus-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-columns-plus-right, url("/icons/columns-plus-right.svg"));
          mask: var(--icon-url-columns-plus-right, url("/icons/columns-plus-right.svg"));
}

.svg-columns {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-columns, url("/icons/columns.svg"));
          mask: var(--icon-url-columns, url("/icons/columns.svg"));
}

.svg-command {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-command, url("/icons/command.svg"));
          mask: var(--icon-url-command, url("/icons/command.svg"));
}

.svg-compass-rose {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-compass-rose, url("/icons/compass-rose.svg"));
          mask: var(--icon-url-compass-rose, url("/icons/compass-rose.svg"));
}

.svg-compass-tool {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-compass-tool, url("/icons/compass-tool.svg"));
          mask: var(--icon-url-compass-tool, url("/icons/compass-tool.svg"));
}

.svg-compass {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-compass, url("/icons/compass.svg"));
          mask: var(--icon-url-compass, url("/icons/compass.svg"));
}

.svg-computer-tower {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-computer-tower, url("/icons/computer-tower.svg"));
          mask: var(--icon-url-computer-tower, url("/icons/computer-tower.svg"));
}

.svg-confetti {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-confetti, url("/icons/confetti.svg"));
          mask: var(--icon-url-confetti, url("/icons/confetti.svg"));
}

.svg-contactless-payment {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-contactless-payment, url("/icons/contactless-payment.svg"));
          mask: var(--icon-url-contactless-payment, url("/icons/contactless-payment.svg"));
}

.svg-control {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-control, url("/icons/control.svg"));
          mask: var(--icon-url-control, url("/icons/control.svg"));
}

.svg-cookie {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cookie, url("/icons/cookie.svg"));
          mask: var(--icon-url-cookie, url("/icons/cookie.svg"));
}

.svg-cooking-pot {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cooking-pot, url("/icons/cooking-pot.svg"));
          mask: var(--icon-url-cooking-pot, url("/icons/cooking-pot.svg"));
}

.svg-copy-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-copy-simple, url("/icons/copy-simple.svg"));
          mask: var(--icon-url-copy-simple, url("/icons/copy-simple.svg"));
}

.svg-copy {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-copy, url("/icons/copy.svg"));
          mask: var(--icon-url-copy, url("/icons/copy.svg"));
}

.svg-copyleft {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-copyleft, url("/icons/copyleft.svg"));
          mask: var(--icon-url-copyleft, url("/icons/copyleft.svg"));
}

.svg-copyright {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-copyright, url("/icons/copyright.svg"));
          mask: var(--icon-url-copyright, url("/icons/copyright.svg"));
}

.svg-corners-in {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-corners-in, url("/icons/corners-in.svg"));
          mask: var(--icon-url-corners-in, url("/icons/corners-in.svg"));
}

.svg-corners-out {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-corners-out, url("/icons/corners-out.svg"));
          mask: var(--icon-url-corners-out, url("/icons/corners-out.svg"));
}

.svg-couch {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-couch, url("/icons/couch.svg"));
          mask: var(--icon-url-couch, url("/icons/couch.svg"));
}

.svg-court-basketball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-court-basketball, url("/icons/court-basketball.svg"));
          mask: var(--icon-url-court-basketball, url("/icons/court-basketball.svg"));
}

.svg-cow {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cow, url("/icons/cow.svg"));
          mask: var(--icon-url-cow, url("/icons/cow.svg"));
}

.svg-cowboy-hat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cowboy-hat, url("/icons/cowboy-hat.svg"));
          mask: var(--icon-url-cowboy-hat, url("/icons/cowboy-hat.svg"));
}

.svg-cpu {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cpu, url("/icons/cpu.svg"));
          mask: var(--icon-url-cpu, url("/icons/cpu.svg"));
}

.svg-crane-tower {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-crane-tower, url("/icons/crane-tower.svg"));
          mask: var(--icon-url-crane-tower, url("/icons/crane-tower.svg"));
}

.svg-crane {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-crane, url("/icons/crane.svg"));
          mask: var(--icon-url-crane, url("/icons/crane.svg"));
}

.svg-credit-card {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-credit-card, url("/icons/credit-card.svg"));
          mask: var(--icon-url-credit-card, url("/icons/credit-card.svg"));
}

.svg-cricket {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cricket, url("/icons/cricket.svg"));
          mask: var(--icon-url-cricket, url("/icons/cricket.svg"));
}

.svg-crop {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-crop, url("/icons/crop.svg"));
          mask: var(--icon-url-crop, url("/icons/crop.svg"));
}

.svg-cross {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cross, url("/icons/cross.svg"));
          mask: var(--icon-url-cross, url("/icons/cross.svg"));
}

.svg-crosshair-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-crosshair-simple, url("/icons/crosshair-simple.svg"));
          mask: var(--icon-url-crosshair-simple, url("/icons/crosshair-simple.svg"));
}

.svg-crosshair {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-crosshair, url("/icons/crosshair.svg"));
          mask: var(--icon-url-crosshair, url("/icons/crosshair.svg"));
}

.svg-crown-cross {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-crown-cross, url("/icons/crown-cross.svg"));
          mask: var(--icon-url-crown-cross, url("/icons/crown-cross.svg"));
}

.svg-crown-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-crown-simple, url("/icons/crown-simple.svg"));
          mask: var(--icon-url-crown-simple, url("/icons/crown-simple.svg"));
}

.svg-crown {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-crown, url("/icons/crown.svg"));
          mask: var(--icon-url-crown, url("/icons/crown.svg"));
}

.svg-cube-focus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cube-focus, url("/icons/cube-focus.svg"));
          mask: var(--icon-url-cube-focus, url("/icons/cube-focus.svg"));
}

.svg-cube-transparent {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cube-transparent, url("/icons/cube-transparent.svg"));
          mask: var(--icon-url-cube-transparent, url("/icons/cube-transparent.svg"));
}

.svg-cube {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cube, url("/icons/cube.svg"));
          mask: var(--icon-url-cube, url("/icons/cube.svg"));
}

.svg-currency-btc {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-btc, url("/icons/currency-btc.svg"));
          mask: var(--icon-url-currency-btc, url("/icons/currency-btc.svg"));
}

.svg-currency-circle-dollar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-circle-dollar, url("/icons/currency-circle-dollar.svg"));
          mask: var(--icon-url-currency-circle-dollar, url("/icons/currency-circle-dollar.svg"));
}

.svg-currency-cny {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-cny, url("/icons/currency-cny.svg"));
          mask: var(--icon-url-currency-cny, url("/icons/currency-cny.svg"));
}

.svg-currency-dollar-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-dollar-simple, url("/icons/currency-dollar-simple.svg"));
          mask: var(--icon-url-currency-dollar-simple, url("/icons/currency-dollar-simple.svg"));
}

.svg-currency-dollar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-dollar, url("/icons/currency-dollar.svg"));
          mask: var(--icon-url-currency-dollar, url("/icons/currency-dollar.svg"));
}

.svg-currency-eth {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-eth, url("/icons/currency-eth.svg"));
          mask: var(--icon-url-currency-eth, url("/icons/currency-eth.svg"));
}

.svg-currency-eur {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-eur, url("/icons/currency-eur.svg"));
          mask: var(--icon-url-currency-eur, url("/icons/currency-eur.svg"));
}

.svg-currency-gbp {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-gbp, url("/icons/currency-gbp.svg"));
          mask: var(--icon-url-currency-gbp, url("/icons/currency-gbp.svg"));
}

.svg-currency-inr {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-inr, url("/icons/currency-inr.svg"));
          mask: var(--icon-url-currency-inr, url("/icons/currency-inr.svg"));
}

.svg-currency-jpy {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-jpy, url("/icons/currency-jpy.svg"));
          mask: var(--icon-url-currency-jpy, url("/icons/currency-jpy.svg"));
}

.svg-currency-krw {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-krw, url("/icons/currency-krw.svg"));
          mask: var(--icon-url-currency-krw, url("/icons/currency-krw.svg"));
}

.svg-currency-kzt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-kzt, url("/icons/currency-kzt.svg"));
          mask: var(--icon-url-currency-kzt, url("/icons/currency-kzt.svg"));
}

.svg-currency-ngn {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-ngn, url("/icons/currency-ngn.svg"));
          mask: var(--icon-url-currency-ngn, url("/icons/currency-ngn.svg"));
}

.svg-currency-rub {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-currency-rub, url("/icons/currency-rub.svg"));
          mask: var(--icon-url-currency-rub, url("/icons/currency-rub.svg"));
}

.svg-cursor-click {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cursor-click, url("/icons/cursor-click.svg"));
          mask: var(--icon-url-cursor-click, url("/icons/cursor-click.svg"));
}

.svg-cursor-text {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cursor-text, url("/icons/cursor-text.svg"));
          mask: var(--icon-url-cursor-text, url("/icons/cursor-text.svg"));
}

.svg-cursor {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cursor, url("/icons/cursor.svg"));
          mask: var(--icon-url-cursor, url("/icons/cursor.svg"));
}

.svg-cylinder {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-cylinder, url("/icons/cylinder.svg"));
          mask: var(--icon-url-cylinder, url("/icons/cylinder.svg"));
}

.svg-database {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-database, url("/icons/database.svg"));
          mask: var(--icon-url-database, url("/icons/database.svg"));
}

.svg-desk {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-desk, url("/icons/desk.svg"));
          mask: var(--icon-url-desk, url("/icons/desk.svg"));
}

.svg-desktop-tower {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-desktop-tower, url("/icons/desktop-tower.svg"));
          mask: var(--icon-url-desktop-tower, url("/icons/desktop-tower.svg"));
}

.svg-desktop {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-desktop, url("/icons/desktop.svg"));
          mask: var(--icon-url-desktop, url("/icons/desktop.svg"));
}

.svg-detective {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-detective, url("/icons/detective.svg"));
          mask: var(--icon-url-detective, url("/icons/detective.svg"));
}

.svg-dev-to-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dev-to-logo, url("/icons/dev-to-logo.svg"));
          mask: var(--icon-url-dev-to-logo, url("/icons/dev-to-logo.svg"));
}

.svg-device-mobile-camera {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-device-mobile-camera, url("/icons/device-mobile-camera.svg"));
          mask: var(--icon-url-device-mobile-camera, url("/icons/device-mobile-camera.svg"));
}

.svg-device-mobile-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-device-mobile-slash, url("/icons/device-mobile-slash.svg"));
          mask: var(--icon-url-device-mobile-slash, url("/icons/device-mobile-slash.svg"));
}

.svg-device-mobile-speaker {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-device-mobile-speaker, url("/icons/device-mobile-speaker.svg"));
          mask: var(--icon-url-device-mobile-speaker, url("/icons/device-mobile-speaker.svg"));
}

.svg-device-mobile {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-device-mobile, url("/icons/device-mobile.svg"));
          mask: var(--icon-url-device-mobile, url("/icons/device-mobile.svg"));
}

.svg-device-rotate {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-device-rotate, url("/icons/device-rotate.svg"));
          mask: var(--icon-url-device-rotate, url("/icons/device-rotate.svg"));
}

.svg-device-tablet-camera {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-device-tablet-camera, url("/icons/device-tablet-camera.svg"));
          mask: var(--icon-url-device-tablet-camera, url("/icons/device-tablet-camera.svg"));
}

.svg-device-tablet-speaker {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-device-tablet-speaker, url("/icons/device-tablet-speaker.svg"));
          mask: var(--icon-url-device-tablet-speaker, url("/icons/device-tablet-speaker.svg"));
}

.svg-device-tablet {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-device-tablet, url("/icons/device-tablet.svg"));
          mask: var(--icon-url-device-tablet, url("/icons/device-tablet.svg"));
}

.svg-devices {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-devices, url("/icons/devices.svg"));
          mask: var(--icon-url-devices, url("/icons/devices.svg"));
}

.svg-diamond {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-diamond, url("/icons/diamond.svg"));
          mask: var(--icon-url-diamond, url("/icons/diamond.svg"));
}

.svg-diamonds-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-diamonds-four, url("/icons/diamonds-four.svg"));
          mask: var(--icon-url-diamonds-four, url("/icons/diamonds-four.svg"));
}

.svg-dice-five {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dice-five, url("/icons/dice-five.svg"));
          mask: var(--icon-url-dice-five, url("/icons/dice-five.svg"));
}

.svg-dice-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dice-four, url("/icons/dice-four.svg"));
          mask: var(--icon-url-dice-four, url("/icons/dice-four.svg"));
}

.svg-dice-one {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dice-one, url("/icons/dice-one.svg"));
          mask: var(--icon-url-dice-one, url("/icons/dice-one.svg"));
}

.svg-dice-six {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dice-six, url("/icons/dice-six.svg"));
          mask: var(--icon-url-dice-six, url("/icons/dice-six.svg"));
}

.svg-dice-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dice-three, url("/icons/dice-three.svg"));
          mask: var(--icon-url-dice-three, url("/icons/dice-three.svg"));
}

.svg-dice-two {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dice-two, url("/icons/dice-two.svg"));
          mask: var(--icon-url-dice-two, url("/icons/dice-two.svg"));
}

.svg-disc {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-disc, url("/icons/disc.svg"));
          mask: var(--icon-url-disc, url("/icons/disc.svg"));
}

.svg-disco-ball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-disco-ball, url("/icons/disco-ball.svg"));
          mask: var(--icon-url-disco-ball, url("/icons/disco-ball.svg"));
}

.svg-discord-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-discord-logo, url("/icons/discord-logo.svg"));
          mask: var(--icon-url-discord-logo, url("/icons/discord-logo.svg"));
}

.svg-divide {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-divide, url("/icons/divide.svg"));
          mask: var(--icon-url-divide, url("/icons/divide.svg"));
}

.svg-dna {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dna, url("/icons/dna.svg"));
          mask: var(--icon-url-dna, url("/icons/dna.svg"));
}

.svg-dog {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dog, url("/icons/dog.svg"));
          mask: var(--icon-url-dog, url("/icons/dog.svg"));
}

.svg-door-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-door-open, url("/icons/door-open.svg"));
          mask: var(--icon-url-door-open, url("/icons/door-open.svg"));
}

.svg-door {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-door, url("/icons/door.svg"));
          mask: var(--icon-url-door, url("/icons/door.svg"));
}

.svg-dot-outline {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dot-outline, url("/icons/dot-outline.svg"));
          mask: var(--icon-url-dot-outline, url("/icons/dot-outline.svg"));
}

.svg-dot {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dot, url("/icons/dot.svg"));
          mask: var(--icon-url-dot, url("/icons/dot.svg"));
}

.svg-dots-nine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-nine, url("/icons/dots-nine.svg"));
          mask: var(--icon-url-dots-nine, url("/icons/dots-nine.svg"));
}

.svg-dots-six-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-six-vertical, url("/icons/dots-six-vertical.svg"));
          mask: var(--icon-url-dots-six-vertical, url("/icons/dots-six-vertical.svg"));
}

.svg-dots-six {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-six, url("/icons/dots-six.svg"));
          mask: var(--icon-url-dots-six, url("/icons/dots-six.svg"));
}

.svg-dots-three-circle-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-three-circle-vertical, url("/icons/dots-three-circle-vertical.svg"));
          mask: var(--icon-url-dots-three-circle-vertical, url("/icons/dots-three-circle-vertical.svg"));
}

.svg-dots-three-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-three-circle, url("/icons/dots-three-circle.svg"));
          mask: var(--icon-url-dots-three-circle, url("/icons/dots-three-circle.svg"));
}

.svg-dots-three-outline-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-three-outline-vertical, url("/icons/dots-three-outline-vertical.svg"));
          mask: var(--icon-url-dots-three-outline-vertical, url("/icons/dots-three-outline-vertical.svg"));
}

.svg-dots-three-outline {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-three-outline, url("/icons/dots-three-outline.svg"));
          mask: var(--icon-url-dots-three-outline, url("/icons/dots-three-outline.svg"));
}

.svg-dots-three-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-three-vertical, url("/icons/dots-three-vertical.svg"));
          mask: var(--icon-url-dots-three-vertical, url("/icons/dots-three-vertical.svg"));
}

.svg-dots-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dots-three, url("/icons/dots-three.svg"));
          mask: var(--icon-url-dots-three, url("/icons/dots-three.svg"));
}

.svg-download-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-download-simple, url("/icons/download-simple.svg"));
          mask: var(--icon-url-download-simple, url("/icons/download-simple.svg"));
}

.svg-download {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-download, url("/icons/download.svg"));
          mask: var(--icon-url-download, url("/icons/download.svg"));
}

.svg-dress {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dress, url("/icons/dress.svg"));
          mask: var(--icon-url-dress, url("/icons/dress.svg"));
}

.svg-dresser {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dresser, url("/icons/dresser.svg"));
          mask: var(--icon-url-dresser, url("/icons/dresser.svg"));
}

.svg-dribbble-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dribbble-logo, url("/icons/dribbble-logo.svg"));
          mask: var(--icon-url-dribbble-logo, url("/icons/dribbble-logo.svg"));
}

.svg-drone {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-drone, url("/icons/drone.svg"));
          mask: var(--icon-url-drone, url("/icons/drone.svg"));
}

.svg-drop-half-bottom {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-drop-half-bottom, url("/icons/drop-half-bottom.svg"));
          mask: var(--icon-url-drop-half-bottom, url("/icons/drop-half-bottom.svg"));
}

.svg-drop-half {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-drop-half, url("/icons/drop-half.svg"));
          mask: var(--icon-url-drop-half, url("/icons/drop-half.svg"));
}

.svg-drop-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-drop-simple, url("/icons/drop-simple.svg"));
          mask: var(--icon-url-drop-simple, url("/icons/drop-simple.svg"));
}

.svg-drop-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-drop-slash, url("/icons/drop-slash.svg"));
          mask: var(--icon-url-drop-slash, url("/icons/drop-slash.svg"));
}

.svg-drop {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-drop, url("/icons/drop.svg"));
          mask: var(--icon-url-drop, url("/icons/drop.svg"));
}

.svg-dropbox-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-dropbox-logo, url("/icons/dropbox-logo.svg"));
          mask: var(--icon-url-dropbox-logo, url("/icons/dropbox-logo.svg"));
}

.svg-ear-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ear-slash, url("/icons/ear-slash.svg"));
          mask: var(--icon-url-ear-slash, url("/icons/ear-slash.svg"));
}

.svg-ear {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ear, url("/icons/ear.svg"));
          mask: var(--icon-url-ear, url("/icons/ear.svg"));
}

.svg-egg-crack {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-egg-crack, url("/icons/egg-crack.svg"));
          mask: var(--icon-url-egg-crack, url("/icons/egg-crack.svg"));
}

.svg-egg {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-egg, url("/icons/egg.svg"));
          mask: var(--icon-url-egg, url("/icons/egg.svg"));
}

.svg-eject-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eject-simple, url("/icons/eject-simple.svg"));
          mask: var(--icon-url-eject-simple, url("/icons/eject-simple.svg"));
}

.svg-eject {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eject, url("/icons/eject.svg"));
          mask: var(--icon-url-eject, url("/icons/eject.svg"));
}

.svg-elevator {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-elevator, url("/icons/elevator.svg"));
          mask: var(--icon-url-elevator, url("/icons/elevator.svg"));
}

.svg-empty {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-empty, url("/icons/empty.svg"));
          mask: var(--icon-url-empty, url("/icons/empty.svg"));
}

.svg-engine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-engine, url("/icons/engine.svg"));
          mask: var(--icon-url-engine, url("/icons/engine.svg"));
}

.svg-envelope-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-envelope-open, url("/icons/envelope-open.svg"));
          mask: var(--icon-url-envelope-open, url("/icons/envelope-open.svg"));
}

.svg-envelope-simple-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-envelope-simple-open, url("/icons/envelope-simple-open.svg"));
          mask: var(--icon-url-envelope-simple-open, url("/icons/envelope-simple-open.svg"));
}

.svg-envelope-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-envelope-simple, url("/icons/envelope-simple.svg"));
          mask: var(--icon-url-envelope-simple, url("/icons/envelope-simple.svg"));
}

.svg-envelope {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-envelope, url("/icons/envelope.svg"));
          mask: var(--icon-url-envelope, url("/icons/envelope.svg"));
}

.svg-equalizer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-equalizer, url("/icons/equalizer.svg"));
          mask: var(--icon-url-equalizer, url("/icons/equalizer.svg"));
}

.svg-equals {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-equals, url("/icons/equals.svg"));
          mask: var(--icon-url-equals, url("/icons/equals.svg"));
}

.svg-eraser {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eraser, url("/icons/eraser.svg"));
          mask: var(--icon-url-eraser, url("/icons/eraser.svg"));
}

.svg-escalator-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-escalator-down, url("/icons/escalator-down.svg"));
          mask: var(--icon-url-escalator-down, url("/icons/escalator-down.svg"));
}

.svg-escalator-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-escalator-up, url("/icons/escalator-up.svg"));
          mask: var(--icon-url-escalator-up, url("/icons/escalator-up.svg"));
}

.svg-exam {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-exam, url("/icons/exam.svg"));
          mask: var(--icon-url-exam, url("/icons/exam.svg"));
}

.svg-exclamation-mark {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-exclamation-mark, url("/icons/exclamation-mark.svg"));
          mask: var(--icon-url-exclamation-mark, url("/icons/exclamation-mark.svg"));
}

.svg-exclude-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-exclude-square, url("/icons/exclude-square.svg"));
          mask: var(--icon-url-exclude-square, url("/icons/exclude-square.svg"));
}

.svg-exclude {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-exclude, url("/icons/exclude.svg"));
          mask: var(--icon-url-exclude, url("/icons/exclude.svg"));
}

.svg-export {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-export, url("/icons/export.svg"));
          mask: var(--icon-url-export, url("/icons/export.svg"));
}

.svg-eye-closed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eye-closed, url("/icons/eye-closed.svg"));
          mask: var(--icon-url-eye-closed, url("/icons/eye-closed.svg"));
}

.svg-eye-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eye-slash, url("/icons/eye-slash.svg"));
          mask: var(--icon-url-eye-slash, url("/icons/eye-slash.svg"));
}

.svg-eye {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eye, url("/icons/eye.svg"));
          mask: var(--icon-url-eye, url("/icons/eye.svg"));
}

.svg-eyedropper-sample {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eyedropper-sample, url("/icons/eyedropper-sample.svg"));
          mask: var(--icon-url-eyedropper-sample, url("/icons/eyedropper-sample.svg"));
}

.svg-eyedropper {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eyedropper, url("/icons/eyedropper.svg"));
          mask: var(--icon-url-eyedropper, url("/icons/eyedropper.svg"));
}

.svg-eyeglasses {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eyeglasses, url("/icons/eyeglasses.svg"));
          mask: var(--icon-url-eyeglasses, url("/icons/eyeglasses.svg"));
}

.svg-eyes {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-eyes, url("/icons/eyes.svg"));
          mask: var(--icon-url-eyes, url("/icons/eyes.svg"));
}

.svg-face-mask {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-face-mask, url("/icons/face-mask.svg"));
          mask: var(--icon-url-face-mask, url("/icons/face-mask.svg"));
}

.svg-facebook-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-facebook-logo, url("/icons/facebook-logo.svg"));
          mask: var(--icon-url-facebook-logo, url("/icons/facebook-logo.svg"));
}

.svg-factory {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-factory, url("/icons/factory.svg"));
          mask: var(--icon-url-factory, url("/icons/factory.svg"));
}

.svg-faders-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-faders-horizontal, url("/icons/faders-horizontal.svg"));
          mask: var(--icon-url-faders-horizontal, url("/icons/faders-horizontal.svg"));
}

.svg-faders {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-faders, url("/icons/faders.svg"));
          mask: var(--icon-url-faders, url("/icons/faders.svg"));
}

.svg-fallout-shelter {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fallout-shelter, url("/icons/fallout-shelter.svg"));
          mask: var(--icon-url-fallout-shelter, url("/icons/fallout-shelter.svg"));
}

.svg-fan {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fan, url("/icons/fan.svg"));
          mask: var(--icon-url-fan, url("/icons/fan.svg"));
}

.svg-farm {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-farm, url("/icons/farm.svg"));
          mask: var(--icon-url-farm, url("/icons/farm.svg"));
}

.svg-fast-forward-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fast-forward-circle, url("/icons/fast-forward-circle.svg"));
          mask: var(--icon-url-fast-forward-circle, url("/icons/fast-forward-circle.svg"));
}

.svg-fast-forward {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fast-forward, url("/icons/fast-forward.svg"));
          mask: var(--icon-url-fast-forward, url("/icons/fast-forward.svg"));
}

.svg-feather {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-feather, url("/icons/feather.svg"));
          mask: var(--icon-url-feather, url("/icons/feather.svg"));
}

.svg-fediverse-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fediverse-logo, url("/icons/fediverse-logo.svg"));
          mask: var(--icon-url-fediverse-logo, url("/icons/fediverse-logo.svg"));
}

.svg-figma-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-figma-logo, url("/icons/figma-logo.svg"));
          mask: var(--icon-url-figma-logo, url("/icons/figma-logo.svg"));
}

.svg-file-archive {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-archive, url("/icons/file-archive.svg"));
          mask: var(--icon-url-file-archive, url("/icons/file-archive.svg"));
}

.svg-file-arrow-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-arrow-down, url("/icons/file-arrow-down.svg"));
          mask: var(--icon-url-file-arrow-down, url("/icons/file-arrow-down.svg"));
}

.svg-file-arrow-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-arrow-up, url("/icons/file-arrow-up.svg"));
          mask: var(--icon-url-file-arrow-up, url("/icons/file-arrow-up.svg"));
}

.svg-file-audio {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-audio, url("/icons/file-audio.svg"));
          mask: var(--icon-url-file-audio, url("/icons/file-audio.svg"));
}

.svg-file-c-sharp {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-c-sharp, url("/icons/file-c-sharp.svg"));
          mask: var(--icon-url-file-c-sharp, url("/icons/file-c-sharp.svg"));
}

.svg-file-c {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-c, url("/icons/file-c.svg"));
          mask: var(--icon-url-file-c, url("/icons/file-c.svg"));
}

.svg-file-cloud {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-cloud, url("/icons/file-cloud.svg"));
          mask: var(--icon-url-file-cloud, url("/icons/file-cloud.svg"));
}

.svg-file-code {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-code, url("/icons/file-code.svg"));
          mask: var(--icon-url-file-code, url("/icons/file-code.svg"));
}

.svg-file-cpp {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-cpp, url("/icons/file-cpp.svg"));
          mask: var(--icon-url-file-cpp, url("/icons/file-cpp.svg"));
}

.svg-file-css {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-css, url("/icons/file-css.svg"));
          mask: var(--icon-url-file-css, url("/icons/file-css.svg"));
}

.svg-file-csv {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-csv, url("/icons/file-csv.svg"));
          mask: var(--icon-url-file-csv, url("/icons/file-csv.svg"));
}

.svg-file-dashed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-dashed, url("/icons/file-dashed.svg"));
          mask: var(--icon-url-file-dashed, url("/icons/file-dashed.svg"));
}

.svg-file-doc {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-doc, url("/icons/file-doc.svg"));
          mask: var(--icon-url-file-doc, url("/icons/file-doc.svg"));
}

.svg-file-html {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-html, url("/icons/file-html.svg"));
          mask: var(--icon-url-file-html, url("/icons/file-html.svg"));
}

.svg-file-image {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-image, url("/icons/file-image.svg"));
          mask: var(--icon-url-file-image, url("/icons/file-image.svg"));
}

.svg-file-ini {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-ini, url("/icons/file-ini.svg"));
          mask: var(--icon-url-file-ini, url("/icons/file-ini.svg"));
}

.svg-file-jpg {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-jpg, url("/icons/file-jpg.svg"));
          mask: var(--icon-url-file-jpg, url("/icons/file-jpg.svg"));
}

.svg-file-js {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-js, url("/icons/file-js.svg"));
          mask: var(--icon-url-file-js, url("/icons/file-js.svg"));
}

.svg-file-jsx {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-jsx, url("/icons/file-jsx.svg"));
          mask: var(--icon-url-file-jsx, url("/icons/file-jsx.svg"));
}

.svg-file-lock {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-lock, url("/icons/file-lock.svg"));
          mask: var(--icon-url-file-lock, url("/icons/file-lock.svg"));
}

.svg-file-magnifying-glass {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-magnifying-glass, url("/icons/file-magnifying-glass.svg"));
          mask: var(--icon-url-file-magnifying-glass, url("/icons/file-magnifying-glass.svg"));
}

.svg-file-md {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-md, url("/icons/file-md.svg"));
          mask: var(--icon-url-file-md, url("/icons/file-md.svg"));
}

.svg-file-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-minus, url("/icons/file-minus.svg"));
          mask: var(--icon-url-file-minus, url("/icons/file-minus.svg"));
}

.svg-file-pdf {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-pdf, url("/icons/file-pdf.svg"));
          mask: var(--icon-url-file-pdf, url("/icons/file-pdf.svg"));
}

.svg-file-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-plus, url("/icons/file-plus.svg"));
          mask: var(--icon-url-file-plus, url("/icons/file-plus.svg"));
}

.svg-file-png {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-png, url("/icons/file-png.svg"));
          mask: var(--icon-url-file-png, url("/icons/file-png.svg"));
}

.svg-file-ppt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-ppt, url("/icons/file-ppt.svg"));
          mask: var(--icon-url-file-ppt, url("/icons/file-ppt.svg"));
}

.svg-file-py {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-py, url("/icons/file-py.svg"));
          mask: var(--icon-url-file-py, url("/icons/file-py.svg"));
}

.svg-file-rs {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-rs, url("/icons/file-rs.svg"));
          mask: var(--icon-url-file-rs, url("/icons/file-rs.svg"));
}

.svg-file-sql {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-sql, url("/icons/file-sql.svg"));
          mask: var(--icon-url-file-sql, url("/icons/file-sql.svg"));
}

.svg-file-svg {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-svg, url("/icons/file-svg.svg"));
          mask: var(--icon-url-file-svg, url("/icons/file-svg.svg"));
}

.svg-file-text {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-text, url("/icons/file-text.svg"));
          mask: var(--icon-url-file-text, url("/icons/file-text.svg"));
}

.svg-file-ts {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-ts, url("/icons/file-ts.svg"));
          mask: var(--icon-url-file-ts, url("/icons/file-ts.svg"));
}

.svg-file-tsx {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-tsx, url("/icons/file-tsx.svg"));
          mask: var(--icon-url-file-tsx, url("/icons/file-tsx.svg"));
}

.svg-file-txt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-txt, url("/icons/file-txt.svg"));
          mask: var(--icon-url-file-txt, url("/icons/file-txt.svg"));
}

.svg-file-video {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-video, url("/icons/file-video.svg"));
          mask: var(--icon-url-file-video, url("/icons/file-video.svg"));
}

.svg-file-vue {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-vue, url("/icons/file-vue.svg"));
          mask: var(--icon-url-file-vue, url("/icons/file-vue.svg"));
}

.svg-file-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-x, url("/icons/file-x.svg"));
          mask: var(--icon-url-file-x, url("/icons/file-x.svg"));
}

.svg-file-xls {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-xls, url("/icons/file-xls.svg"));
          mask: var(--icon-url-file-xls, url("/icons/file-xls.svg"));
}

.svg-file-zip {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file-zip, url("/icons/file-zip.svg"));
          mask: var(--icon-url-file-zip, url("/icons/file-zip.svg"));
}

.svg-file {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-file, url("/icons/file.svg"));
          mask: var(--icon-url-file, url("/icons/file.svg"));
}

.svg-files {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-files, url("/icons/files.svg"));
          mask: var(--icon-url-files, url("/icons/files.svg"));
}

.svg-film-reel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-film-reel, url("/icons/film-reel.svg"));
          mask: var(--icon-url-film-reel, url("/icons/film-reel.svg"));
}

.svg-film-script {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-film-script, url("/icons/film-script.svg"));
          mask: var(--icon-url-film-script, url("/icons/film-script.svg"));
}

.svg-film-slate {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-film-slate, url("/icons/film-slate.svg"));
          mask: var(--icon-url-film-slate, url("/icons/film-slate.svg"));
}

.svg-film-strip {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-film-strip, url("/icons/film-strip.svg"));
          mask: var(--icon-url-film-strip, url("/icons/film-strip.svg"));
}

.svg-fingerprint-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fingerprint-simple, url("/icons/fingerprint-simple.svg"));
          mask: var(--icon-url-fingerprint-simple, url("/icons/fingerprint-simple.svg"));
}

.svg-fingerprint {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fingerprint, url("/icons/fingerprint.svg"));
          mask: var(--icon-url-fingerprint, url("/icons/fingerprint.svg"));
}

.svg-finn-the-human {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-finn-the-human, url("/icons/finn-the-human.svg"));
          mask: var(--icon-url-finn-the-human, url("/icons/finn-the-human.svg"));
}

.svg-fire-extinguisher {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fire-extinguisher, url("/icons/fire-extinguisher.svg"));
          mask: var(--icon-url-fire-extinguisher, url("/icons/fire-extinguisher.svg"));
}

.svg-fire-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fire-simple, url("/icons/fire-simple.svg"));
          mask: var(--icon-url-fire-simple, url("/icons/fire-simple.svg"));
}

.svg-fire-truck {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fire-truck, url("/icons/fire-truck.svg"));
          mask: var(--icon-url-fire-truck, url("/icons/fire-truck.svg"));
}

.svg-fire {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fire, url("/icons/fire.svg"));
          mask: var(--icon-url-fire, url("/icons/fire.svg"));
}

.svg-first-aid-kit {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-first-aid-kit, url("/icons/first-aid-kit.svg"));
          mask: var(--icon-url-first-aid-kit, url("/icons/first-aid-kit.svg"));
}

.svg-first-aid {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-first-aid, url("/icons/first-aid.svg"));
          mask: var(--icon-url-first-aid, url("/icons/first-aid.svg"));
}

.svg-fish-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fish-simple, url("/icons/fish-simple.svg"));
          mask: var(--icon-url-fish-simple, url("/icons/fish-simple.svg"));
}

.svg-fish {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fish, url("/icons/fish.svg"));
          mask: var(--icon-url-fish, url("/icons/fish.svg"));
}

.svg-flag-banner-fold {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flag-banner-fold, url("/icons/flag-banner-fold.svg"));
          mask: var(--icon-url-flag-banner-fold, url("/icons/flag-banner-fold.svg"));
}

.svg-flag-banner {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flag-banner, url("/icons/flag-banner.svg"));
          mask: var(--icon-url-flag-banner, url("/icons/flag-banner.svg"));
}

.svg-flag-checkered {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flag-checkered, url("/icons/flag-checkered.svg"));
          mask: var(--icon-url-flag-checkered, url("/icons/flag-checkered.svg"));
}

.svg-flag-pennant {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flag-pennant, url("/icons/flag-pennant.svg"));
          mask: var(--icon-url-flag-pennant, url("/icons/flag-pennant.svg"));
}

.svg-flag {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flag, url("/icons/flag.svg"));
          mask: var(--icon-url-flag, url("/icons/flag.svg"));
}

.svg-flame {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flame, url("/icons/flame.svg"));
          mask: var(--icon-url-flame, url("/icons/flame.svg"));
}

.svg-flashlight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flashlight, url("/icons/flashlight.svg"));
          mask: var(--icon-url-flashlight, url("/icons/flashlight.svg"));
}

.svg-flask {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flask, url("/icons/flask.svg"));
          mask: var(--icon-url-flask, url("/icons/flask.svg"));
}

.svg-flip-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flip-horizontal, url("/icons/flip-horizontal.svg"));
          mask: var(--icon-url-flip-horizontal, url("/icons/flip-horizontal.svg"));
}

.svg-flip-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flip-vertical, url("/icons/flip-vertical.svg"));
          mask: var(--icon-url-flip-vertical, url("/icons/flip-vertical.svg"));
}

.svg-floppy-disk-back {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-floppy-disk-back, url("/icons/floppy-disk-back.svg"));
          mask: var(--icon-url-floppy-disk-back, url("/icons/floppy-disk-back.svg"));
}

.svg-floppy-disk {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-floppy-disk, url("/icons/floppy-disk.svg"));
          mask: var(--icon-url-floppy-disk, url("/icons/floppy-disk.svg"));
}

.svg-flow-arrow {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flow-arrow, url("/icons/flow-arrow.svg"));
          mask: var(--icon-url-flow-arrow, url("/icons/flow-arrow.svg"));
}

.svg-flower-lotus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flower-lotus, url("/icons/flower-lotus.svg"));
          mask: var(--icon-url-flower-lotus, url("/icons/flower-lotus.svg"));
}

.svg-flower-tulip {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flower-tulip, url("/icons/flower-tulip.svg"));
          mask: var(--icon-url-flower-tulip, url("/icons/flower-tulip.svg"));
}

.svg-flower {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flower, url("/icons/flower.svg"));
          mask: var(--icon-url-flower, url("/icons/flower.svg"));
}

.svg-flying-saucer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-flying-saucer, url("/icons/flying-saucer.svg"));
          mask: var(--icon-url-flying-saucer, url("/icons/flying-saucer.svg"));
}

.svg-folder-dashed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-dashed, url("/icons/folder-dashed.svg"));
          mask: var(--icon-url-folder-dashed, url("/icons/folder-dashed.svg"));
}

.svg-folder-lock {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-lock, url("/icons/folder-lock.svg"));
          mask: var(--icon-url-folder-lock, url("/icons/folder-lock.svg"));
}

.svg-folder-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-minus, url("/icons/folder-minus.svg"));
          mask: var(--icon-url-folder-minus, url("/icons/folder-minus.svg"));
}

.svg-folder-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-open, url("/icons/folder-open.svg"));
          mask: var(--icon-url-folder-open, url("/icons/folder-open.svg"));
}

.svg-folder-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-plus, url("/icons/folder-plus.svg"));
          mask: var(--icon-url-folder-plus, url("/icons/folder-plus.svg"));
}

.svg-folder-simple-dashed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-simple-dashed, url("/icons/folder-simple-dashed.svg"));
          mask: var(--icon-url-folder-simple-dashed, url("/icons/folder-simple-dashed.svg"));
}

.svg-folder-simple-lock {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-simple-lock, url("/icons/folder-simple-lock.svg"));
          mask: var(--icon-url-folder-simple-lock, url("/icons/folder-simple-lock.svg"));
}

.svg-folder-simple-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-simple-minus, url("/icons/folder-simple-minus.svg"));
          mask: var(--icon-url-folder-simple-minus, url("/icons/folder-simple-minus.svg"));
}

.svg-folder-simple-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-simple-plus, url("/icons/folder-simple-plus.svg"));
          mask: var(--icon-url-folder-simple-plus, url("/icons/folder-simple-plus.svg"));
}

.svg-folder-simple-star {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-simple-star, url("/icons/folder-simple-star.svg"));
          mask: var(--icon-url-folder-simple-star, url("/icons/folder-simple-star.svg"));
}

.svg-folder-simple-user {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-simple-user, url("/icons/folder-simple-user.svg"));
          mask: var(--icon-url-folder-simple-user, url("/icons/folder-simple-user.svg"));
}

.svg-folder-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-simple, url("/icons/folder-simple.svg"));
          mask: var(--icon-url-folder-simple, url("/icons/folder-simple.svg"));
}

.svg-folder-star {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-star, url("/icons/folder-star.svg"));
          mask: var(--icon-url-folder-star, url("/icons/folder-star.svg"));
}

.svg-folder-user {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder-user, url("/icons/folder-user.svg"));
          mask: var(--icon-url-folder-user, url("/icons/folder-user.svg"));
}

.svg-folder {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folder, url("/icons/folder.svg"));
          mask: var(--icon-url-folder, url("/icons/folder.svg"));
}

.svg-folders {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-folders, url("/icons/folders.svg"));
          mask: var(--icon-url-folders, url("/icons/folders.svg"));
}

.svg-football-helmet {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-football-helmet, url("/icons/football-helmet.svg"));
          mask: var(--icon-url-football-helmet, url("/icons/football-helmet.svg"));
}

.svg-football {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-football, url("/icons/football.svg"));
          mask: var(--icon-url-football, url("/icons/football.svg"));
}

.svg-footprints {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-footprints, url("/icons/footprints.svg"));
          mask: var(--icon-url-footprints, url("/icons/footprints.svg"));
}

.svg-fork-knife {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-fork-knife, url("/icons/fork-knife.svg"));
          mask: var(--icon-url-fork-knife, url("/icons/fork-knife.svg"));
}

.svg-four-k {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-four-k, url("/icons/four-k.svg"));
          mask: var(--icon-url-four-k, url("/icons/four-k.svg"));
}

.svg-frame-corners {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-frame-corners, url("/icons/frame-corners.svg"));
          mask: var(--icon-url-frame-corners, url("/icons/frame-corners.svg"));
}

.svg-framer-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-framer-logo, url("/icons/framer-logo.svg"));
          mask: var(--icon-url-framer-logo, url("/icons/framer-logo.svg"));
}

.svg-function {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-function, url("/icons/function.svg"));
          mask: var(--icon-url-function, url("/icons/function.svg"));
}

.svg-funnel-simple-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-funnel-simple-x, url("/icons/funnel-simple-x.svg"));
          mask: var(--icon-url-funnel-simple-x, url("/icons/funnel-simple-x.svg"));
}

.svg-funnel-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-funnel-simple, url("/icons/funnel-simple.svg"));
          mask: var(--icon-url-funnel-simple, url("/icons/funnel-simple.svg"));
}

.svg-funnel-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-funnel-x, url("/icons/funnel-x.svg"));
          mask: var(--icon-url-funnel-x, url("/icons/funnel-x.svg"));
}

.svg-funnel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-funnel, url("/icons/funnel.svg"));
          mask: var(--icon-url-funnel, url("/icons/funnel.svg"));
}

.svg-game-controller {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-game-controller, url("/icons/game-controller.svg"));
          mask: var(--icon-url-game-controller, url("/icons/game-controller.svg"));
}

.svg-garage {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-garage, url("/icons/garage.svg"));
          mask: var(--icon-url-garage, url("/icons/garage.svg"));
}

.svg-gas-can {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gas-can, url("/icons/gas-can.svg"));
          mask: var(--icon-url-gas-can, url("/icons/gas-can.svg"));
}

.svg-gas-pump {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gas-pump, url("/icons/gas-pump.svg"));
          mask: var(--icon-url-gas-pump, url("/icons/gas-pump.svg"));
}

.svg-gauge {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gauge, url("/icons/gauge.svg"));
          mask: var(--icon-url-gauge, url("/icons/gauge.svg"));
}

.svg-gavel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gavel, url("/icons/gavel.svg"));
          mask: var(--icon-url-gavel, url("/icons/gavel.svg"));
}

.svg-gear-fine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gear-fine, url("/icons/gear-fine.svg"));
          mask: var(--icon-url-gear-fine, url("/icons/gear-fine.svg"));
}

.svg-gear-six {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gear-six, url("/icons/gear-six.svg"));
          mask: var(--icon-url-gear-six, url("/icons/gear-six.svg"));
}

.svg-gear {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gear, url("/icons/gear.svg"));
          mask: var(--icon-url-gear, url("/icons/gear.svg"));
}

.svg-gender-female {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gender-female, url("/icons/gender-female.svg"));
          mask: var(--icon-url-gender-female, url("/icons/gender-female.svg"));
}

.svg-gender-intersex {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gender-intersex, url("/icons/gender-intersex.svg"));
          mask: var(--icon-url-gender-intersex, url("/icons/gender-intersex.svg"));
}

.svg-gender-male {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gender-male, url("/icons/gender-male.svg"));
          mask: var(--icon-url-gender-male, url("/icons/gender-male.svg"));
}

.svg-gender-neuter {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gender-neuter, url("/icons/gender-neuter.svg"));
          mask: var(--icon-url-gender-neuter, url("/icons/gender-neuter.svg"));
}

.svg-gender-nonbinary {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gender-nonbinary, url("/icons/gender-nonbinary.svg"));
          mask: var(--icon-url-gender-nonbinary, url("/icons/gender-nonbinary.svg"));
}

.svg-gender-transgender {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gender-transgender, url("/icons/gender-transgender.svg"));
          mask: var(--icon-url-gender-transgender, url("/icons/gender-transgender.svg"));
}

.svg-ghost {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ghost, url("/icons/ghost.svg"));
          mask: var(--icon-url-ghost, url("/icons/ghost.svg"));
}

.svg-gif {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gif, url("/icons/gif.svg"));
          mask: var(--icon-url-gif, url("/icons/gif.svg"));
}

.svg-gift {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gift, url("/icons/gift.svg"));
          mask: var(--icon-url-gift, url("/icons/gift.svg"));
}

.svg-git-branch {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-git-branch, url("/icons/git-branch.svg"));
          mask: var(--icon-url-git-branch, url("/icons/git-branch.svg"));
}

.svg-git-commit {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-git-commit, url("/icons/git-commit.svg"));
          mask: var(--icon-url-git-commit, url("/icons/git-commit.svg"));
}

.svg-git-diff {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-git-diff, url("/icons/git-diff.svg"));
          mask: var(--icon-url-git-diff, url("/icons/git-diff.svg"));
}

.svg-git-fork {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-git-fork, url("/icons/git-fork.svg"));
          mask: var(--icon-url-git-fork, url("/icons/git-fork.svg"));
}

.svg-git-merge {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-git-merge, url("/icons/git-merge.svg"));
          mask: var(--icon-url-git-merge, url("/icons/git-merge.svg"));
}

.svg-git-pull-request {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-git-pull-request, url("/icons/git-pull-request.svg"));
          mask: var(--icon-url-git-pull-request, url("/icons/git-pull-request.svg"));
}

.svg-github-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-github-logo, url("/icons/github-logo.svg"));
          mask: var(--icon-url-github-logo, url("/icons/github-logo.svg"));
}

.svg-gitlab-logo-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gitlab-logo-simple, url("/icons/gitlab-logo-simple.svg"));
          mask: var(--icon-url-gitlab-logo-simple, url("/icons/gitlab-logo-simple.svg"));
}

.svg-gitlab-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gitlab-logo, url("/icons/gitlab-logo.svg"));
          mask: var(--icon-url-gitlab-logo, url("/icons/gitlab-logo.svg"));
}

.svg-globe-hemisphere-east {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-globe-hemisphere-east, url("/icons/globe-hemisphere-east.svg"));
          mask: var(--icon-url-globe-hemisphere-east, url("/icons/globe-hemisphere-east.svg"));
}

.svg-globe-hemisphere-west {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-globe-hemisphere-west, url("/icons/globe-hemisphere-west.svg"));
          mask: var(--icon-url-globe-hemisphere-west, url("/icons/globe-hemisphere-west.svg"));
}

.svg-globe-simple-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-globe-simple-x, url("/icons/globe-simple-x.svg"));
          mask: var(--icon-url-globe-simple-x, url("/icons/globe-simple-x.svg"));
}

.svg-globe-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-globe-simple, url("/icons/globe-simple.svg"));
          mask: var(--icon-url-globe-simple, url("/icons/globe-simple.svg"));
}

.svg-globe-stand {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-globe-stand, url("/icons/globe-stand.svg"));
          mask: var(--icon-url-globe-stand, url("/icons/globe-stand.svg"));
}

.svg-globe-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-globe-x, url("/icons/globe-x.svg"));
          mask: var(--icon-url-globe-x, url("/icons/globe-x.svg"));
}

.svg-globe {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-globe, url("/icons/globe.svg"));
          mask: var(--icon-url-globe, url("/icons/globe.svg"));
}

.svg-goggles {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-goggles, url("/icons/goggles.svg"));
          mask: var(--icon-url-goggles, url("/icons/goggles.svg"));
}

.svg-golf {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-golf, url("/icons/golf.svg"));
          mask: var(--icon-url-golf, url("/icons/golf.svg"));
}

.svg-goodreads-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-goodreads-logo, url("/icons/goodreads-logo.svg"));
          mask: var(--icon-url-goodreads-logo, url("/icons/goodreads-logo.svg"));
}

.svg-google-cardboard-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-google-cardboard-logo, url("/icons/google-cardboard-logo.svg"));
          mask: var(--icon-url-google-cardboard-logo, url("/icons/google-cardboard-logo.svg"));
}

.svg-google-chrome-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-google-chrome-logo, url("/icons/google-chrome-logo.svg"));
          mask: var(--icon-url-google-chrome-logo, url("/icons/google-chrome-logo.svg"));
}

.svg-google-drive-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-google-drive-logo, url("/icons/google-drive-logo.svg"));
          mask: var(--icon-url-google-drive-logo, url("/icons/google-drive-logo.svg"));
}

.svg-google-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-google-logo, url("/icons/google-logo.svg"));
          mask: var(--icon-url-google-logo, url("/icons/google-logo.svg"));
}

.svg-google-photos-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-google-photos-logo, url("/icons/google-photos-logo.svg"));
          mask: var(--icon-url-google-photos-logo, url("/icons/google-photos-logo.svg"));
}

.svg-google-play-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-google-play-logo, url("/icons/google-play-logo.svg"));
          mask: var(--icon-url-google-play-logo, url("/icons/google-play-logo.svg"));
}

.svg-google-podcasts-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-google-podcasts-logo, url("/icons/google-podcasts-logo.svg"));
          mask: var(--icon-url-google-podcasts-logo, url("/icons/google-podcasts-logo.svg"));
}

.svg-gps-fix {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gps-fix, url("/icons/gps-fix.svg"));
          mask: var(--icon-url-gps-fix, url("/icons/gps-fix.svg"));
}

.svg-gps-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gps-slash, url("/icons/gps-slash.svg"));
          mask: var(--icon-url-gps-slash, url("/icons/gps-slash.svg"));
}

.svg-gps {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gps, url("/icons/gps.svg"));
          mask: var(--icon-url-gps, url("/icons/gps.svg"));
}

.svg-gradient {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-gradient, url("/icons/gradient.svg"));
          mask: var(--icon-url-gradient, url("/icons/gradient.svg"));
}

.svg-graduation-cap {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-graduation-cap, url("/icons/graduation-cap.svg"));
          mask: var(--icon-url-graduation-cap, url("/icons/graduation-cap.svg"));
}

.svg-grains-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-grains-slash, url("/icons/grains-slash.svg"));
          mask: var(--icon-url-grains-slash, url("/icons/grains-slash.svg"));
}

.svg-grains {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-grains, url("/icons/grains.svg"));
          mask: var(--icon-url-grains, url("/icons/grains.svg"));
}

.svg-graph {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-graph, url("/icons/graph.svg"));
          mask: var(--icon-url-graph, url("/icons/graph.svg"));
}

.svg-graphics-card {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-graphics-card, url("/icons/graphics-card.svg"));
          mask: var(--icon-url-graphics-card, url("/icons/graphics-card.svg"));
}

.svg-greater-than-or-equal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-greater-than-or-equal, url("/icons/greater-than-or-equal.svg"));
          mask: var(--icon-url-greater-than-or-equal, url("/icons/greater-than-or-equal.svg"));
}

.svg-greater-than {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-greater-than, url("/icons/greater-than.svg"));
          mask: var(--icon-url-greater-than, url("/icons/greater-than.svg"));
}

.svg-grid-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-grid-four, url("/icons/grid-four.svg"));
          mask: var(--icon-url-grid-four, url("/icons/grid-four.svg"));
}

.svg-grid-nine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-grid-nine, url("/icons/grid-nine.svg"));
          mask: var(--icon-url-grid-nine, url("/icons/grid-nine.svg"));
}

.svg-guitar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-guitar, url("/icons/guitar.svg"));
          mask: var(--icon-url-guitar, url("/icons/guitar.svg"));
}

.svg-hair-dryer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hair-dryer, url("/icons/hair-dryer.svg"));
          mask: var(--icon-url-hair-dryer, url("/icons/hair-dryer.svg"));
}

.svg-hamburger {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hamburger, url("/icons/hamburger.svg"));
          mask: var(--icon-url-hamburger, url("/icons/hamburger.svg"));
}

.svg-hammer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hammer, url("/icons/hammer.svg"));
          mask: var(--icon-url-hammer, url("/icons/hammer.svg"));
}

.svg-hand-arrow-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-arrow-down, url("/icons/hand-arrow-down.svg"));
          mask: var(--icon-url-hand-arrow-down, url("/icons/hand-arrow-down.svg"));
}

.svg-hand-arrow-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-arrow-up, url("/icons/hand-arrow-up.svg"));
          mask: var(--icon-url-hand-arrow-up, url("/icons/hand-arrow-up.svg"));
}

.svg-hand-coins {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-coins, url("/icons/hand-coins.svg"));
          mask: var(--icon-url-hand-coins, url("/icons/hand-coins.svg"));
}

.svg-hand-deposit {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-deposit, url("/icons/hand-deposit.svg"));
          mask: var(--icon-url-hand-deposit, url("/icons/hand-deposit.svg"));
}

.svg-hand-eye {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-eye, url("/icons/hand-eye.svg"));
          mask: var(--icon-url-hand-eye, url("/icons/hand-eye.svg"));
}

.svg-hand-fist {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-fist, url("/icons/hand-fist.svg"));
          mask: var(--icon-url-hand-fist, url("/icons/hand-fist.svg"));
}

.svg-hand-grabbing {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-grabbing, url("/icons/hand-grabbing.svg"));
          mask: var(--icon-url-hand-grabbing, url("/icons/hand-grabbing.svg"));
}

.svg-hand-heart {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-heart, url("/icons/hand-heart.svg"));
          mask: var(--icon-url-hand-heart, url("/icons/hand-heart.svg"));
}

.svg-hand-palm {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-palm, url("/icons/hand-palm.svg"));
          mask: var(--icon-url-hand-palm, url("/icons/hand-palm.svg"));
}

.svg-hand-peace {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-peace, url("/icons/hand-peace.svg"));
          mask: var(--icon-url-hand-peace, url("/icons/hand-peace.svg"));
}

.svg-hand-pointing {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-pointing, url("/icons/hand-pointing.svg"));
          mask: var(--icon-url-hand-pointing, url("/icons/hand-pointing.svg"));
}

.svg-hand-soap {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-soap, url("/icons/hand-soap.svg"));
          mask: var(--icon-url-hand-soap, url("/icons/hand-soap.svg"));
}

.svg-hand-swipe-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-swipe-left, url("/icons/hand-swipe-left.svg"));
          mask: var(--icon-url-hand-swipe-left, url("/icons/hand-swipe-left.svg"));
}

.svg-hand-swipe-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-swipe-right, url("/icons/hand-swipe-right.svg"));
          mask: var(--icon-url-hand-swipe-right, url("/icons/hand-swipe-right.svg"));
}

.svg-hand-tap {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-tap, url("/icons/hand-tap.svg"));
          mask: var(--icon-url-hand-tap, url("/icons/hand-tap.svg"));
}

.svg-hand-waving {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-waving, url("/icons/hand-waving.svg"));
          mask: var(--icon-url-hand-waving, url("/icons/hand-waving.svg"));
}

.svg-hand-withdraw {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand-withdraw, url("/icons/hand-withdraw.svg"));
          mask: var(--icon-url-hand-withdraw, url("/icons/hand-withdraw.svg"));
}

.svg-hand {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hand, url("/icons/hand.svg"));
          mask: var(--icon-url-hand, url("/icons/hand.svg"));
}

.svg-handbag-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-handbag-simple, url("/icons/handbag-simple.svg"));
          mask: var(--icon-url-handbag-simple, url("/icons/handbag-simple.svg"));
}

.svg-handbag {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-handbag, url("/icons/handbag.svg"));
          mask: var(--icon-url-handbag, url("/icons/handbag.svg"));
}

.svg-hands-clapping {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hands-clapping, url("/icons/hands-clapping.svg"));
          mask: var(--icon-url-hands-clapping, url("/icons/hands-clapping.svg"));
}

.svg-hands-praying {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hands-praying, url("/icons/hands-praying.svg"));
          mask: var(--icon-url-hands-praying, url("/icons/hands-praying.svg"));
}

.svg-handshake {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-handshake, url("/icons/handshake.svg"));
          mask: var(--icon-url-handshake, url("/icons/handshake.svg"));
}

.svg-hard-drive {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hard-drive, url("/icons/hard-drive.svg"));
          mask: var(--icon-url-hard-drive, url("/icons/hard-drive.svg"));
}

.svg-hard-drives {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hard-drives, url("/icons/hard-drives.svg"));
          mask: var(--icon-url-hard-drives, url("/icons/hard-drives.svg"));
}

.svg-hard-hat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hard-hat, url("/icons/hard-hat.svg"));
          mask: var(--icon-url-hard-hat, url("/icons/hard-hat.svg"));
}

.svg-hash-straight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hash-straight, url("/icons/hash-straight.svg"));
          mask: var(--icon-url-hash-straight, url("/icons/hash-straight.svg"));
}

.svg-hash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hash, url("/icons/hash.svg"));
          mask: var(--icon-url-hash, url("/icons/hash.svg"));
}

.svg-head-circuit {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-head-circuit, url("/icons/head-circuit.svg"));
          mask: var(--icon-url-head-circuit, url("/icons/head-circuit.svg"));
}

.svg-headlights {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-headlights, url("/icons/headlights.svg"));
          mask: var(--icon-url-headlights, url("/icons/headlights.svg"));
}

.svg-headphones {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-headphones, url("/icons/headphones.svg"));
          mask: var(--icon-url-headphones, url("/icons/headphones.svg"));
}

.svg-headset {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-headset, url("/icons/headset.svg"));
          mask: var(--icon-url-headset, url("/icons/headset.svg"));
}

.svg-heart-break {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-heart-break, url("/icons/heart-break.svg"));
          mask: var(--icon-url-heart-break, url("/icons/heart-break.svg"));
}

.svg-heart-half {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-heart-half, url("/icons/heart-half.svg"));
          mask: var(--icon-url-heart-half, url("/icons/heart-half.svg"));
}

.svg-heart-straight-break {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-heart-straight-break, url("/icons/heart-straight-break.svg"));
          mask: var(--icon-url-heart-straight-break, url("/icons/heart-straight-break.svg"));
}

.svg-heart-straight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-heart-straight, url("/icons/heart-straight.svg"));
          mask: var(--icon-url-heart-straight, url("/icons/heart-straight.svg"));
}

.svg-heart {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-heart, url("/icons/heart.svg"));
          mask: var(--icon-url-heart, url("/icons/heart.svg"));
}

.svg-heartbeat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-heartbeat, url("/icons/heartbeat.svg"));
          mask: var(--icon-url-heartbeat, url("/icons/heartbeat.svg"));
}

.svg-hexagon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hexagon, url("/icons/hexagon.svg"));
          mask: var(--icon-url-hexagon, url("/icons/hexagon.svg"));
}

.svg-high-definition {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-high-definition, url("/icons/high-definition.svg"));
          mask: var(--icon-url-high-definition, url("/icons/high-definition.svg"));
}

.svg-high-heel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-high-heel, url("/icons/high-heel.svg"));
          mask: var(--icon-url-high-heel, url("/icons/high-heel.svg"));
}

.svg-highlighter-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-highlighter-circle, url("/icons/highlighter-circle.svg"));
          mask: var(--icon-url-highlighter-circle, url("/icons/highlighter-circle.svg"));
}

.svg-highlighter {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-highlighter, url("/icons/highlighter.svg"));
          mask: var(--icon-url-highlighter, url("/icons/highlighter.svg"));
}

.svg-hockey {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hockey, url("/icons/hockey.svg"));
          mask: var(--icon-url-hockey, url("/icons/hockey.svg"));
}

.svg-hoodie {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hoodie, url("/icons/hoodie.svg"));
          mask: var(--icon-url-hoodie, url("/icons/hoodie.svg"));
}

.svg-horse {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-horse, url("/icons/horse.svg"));
          mask: var(--icon-url-horse, url("/icons/horse.svg"));
}

.svg-hospital {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hospital, url("/icons/hospital.svg"));
          mask: var(--icon-url-hospital, url("/icons/hospital.svg"));
}

.svg-hourglass-high {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hourglass-high, url("/icons/hourglass-high.svg"));
          mask: var(--icon-url-hourglass-high, url("/icons/hourglass-high.svg"));
}

.svg-hourglass-low {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hourglass-low, url("/icons/hourglass-low.svg"));
          mask: var(--icon-url-hourglass-low, url("/icons/hourglass-low.svg"));
}

.svg-hourglass-medium {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hourglass-medium, url("/icons/hourglass-medium.svg"));
          mask: var(--icon-url-hourglass-medium, url("/icons/hourglass-medium.svg"));
}

.svg-hourglass-simple-high {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hourglass-simple-high, url("/icons/hourglass-simple-high.svg"));
          mask: var(--icon-url-hourglass-simple-high, url("/icons/hourglass-simple-high.svg"));
}

.svg-hourglass-simple-low {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hourglass-simple-low, url("/icons/hourglass-simple-low.svg"));
          mask: var(--icon-url-hourglass-simple-low, url("/icons/hourglass-simple-low.svg"));
}

.svg-hourglass-simple-medium {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hourglass-simple-medium, url("/icons/hourglass-simple-medium.svg"));
          mask: var(--icon-url-hourglass-simple-medium, url("/icons/hourglass-simple-medium.svg"));
}

.svg-hourglass-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hourglass-simple, url("/icons/hourglass-simple.svg"));
          mask: var(--icon-url-hourglass-simple, url("/icons/hourglass-simple.svg"));
}

.svg-hourglass {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hourglass, url("/icons/hourglass.svg"));
          mask: var(--icon-url-hourglass, url("/icons/hourglass.svg"));
}

.svg-house-line {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-house-line, url("/icons/house-line.svg"));
          mask: var(--icon-url-house-line, url("/icons/house-line.svg"));
}

.svg-house-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-house-simple, url("/icons/house-simple.svg"));
          mask: var(--icon-url-house-simple, url("/icons/house-simple.svg"));
}

.svg-house {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-house, url("/icons/house.svg"));
          mask: var(--icon-url-house, url("/icons/house.svg"));
}

.svg-hurricane {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-hurricane, url("/icons/hurricane.svg"));
          mask: var(--icon-url-hurricane, url("/icons/hurricane.svg"));
}

.svg-ice-cream {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ice-cream, url("/icons/ice-cream.svg"));
          mask: var(--icon-url-ice-cream, url("/icons/ice-cream.svg"));
}

.svg-identification-badge {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-identification-badge, url("/icons/identification-badge.svg"));
          mask: var(--icon-url-identification-badge, url("/icons/identification-badge.svg"));
}

.svg-identification-card {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-identification-card, url("/icons/identification-card.svg"));
          mask: var(--icon-url-identification-card, url("/icons/identification-card.svg"));
}

.svg-image-broken {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-image-broken, url("/icons/image-broken.svg"));
          mask: var(--icon-url-image-broken, url("/icons/image-broken.svg"));
}

.svg-image-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-image-square, url("/icons/image-square.svg"));
          mask: var(--icon-url-image-square, url("/icons/image-square.svg"));
}

.svg-image {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-image, url("/icons/image.svg"));
          mask: var(--icon-url-image, url("/icons/image.svg"));
}

.svg-images-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-images-square, url("/icons/images-square.svg"));
          mask: var(--icon-url-images-square, url("/icons/images-square.svg"));
}

.svg-images {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-images, url("/icons/images.svg"));
          mask: var(--icon-url-images, url("/icons/images.svg"));
}

.svg-infinity {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-infinity, url("/icons/infinity.svg"));
          mask: var(--icon-url-infinity, url("/icons/infinity.svg"));
}

.svg-info {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-info, url("/icons/info.svg"));
          mask: var(--icon-url-info, url("/icons/info.svg"));
}

.svg-instagram-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-instagram-logo, url("/icons/instagram-logo.svg"));
          mask: var(--icon-url-instagram-logo, url("/icons/instagram-logo.svg"));
}

.svg-intersect-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-intersect-square, url("/icons/intersect-square.svg"));
          mask: var(--icon-url-intersect-square, url("/icons/intersect-square.svg"));
}

.svg-intersect-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-intersect-three, url("/icons/intersect-three.svg"));
          mask: var(--icon-url-intersect-three, url("/icons/intersect-three.svg"));
}

.svg-intersect {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-intersect, url("/icons/intersect.svg"));
          mask: var(--icon-url-intersect, url("/icons/intersect.svg"));
}

.svg-intersection {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-intersection, url("/icons/intersection.svg"));
          mask: var(--icon-url-intersection, url("/icons/intersection.svg"));
}

.svg-invoice {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-invoice, url("/icons/invoice.svg"));
          mask: var(--icon-url-invoice, url("/icons/invoice.svg"));
}

.svg-island {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-island, url("/icons/island.svg"));
          mask: var(--icon-url-island, url("/icons/island.svg"));
}

.svg-jar-label {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-jar-label, url("/icons/jar-label.svg"));
          mask: var(--icon-url-jar-label, url("/icons/jar-label.svg"));
}

.svg-jar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-jar, url("/icons/jar.svg"));
          mask: var(--icon-url-jar, url("/icons/jar.svg"));
}

.svg-jeep {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-jeep, url("/icons/jeep.svg"));
          mask: var(--icon-url-jeep, url("/icons/jeep.svg"));
}

.svg-joystick {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-joystick, url("/icons/joystick.svg"));
          mask: var(--icon-url-joystick, url("/icons/joystick.svg"));
}

.svg-kanban {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-kanban, url("/icons/kanban.svg"));
          mask: var(--icon-url-kanban, url("/icons/kanban.svg"));
}

.svg-key-return {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-key-return, url("/icons/key-return.svg"));
          mask: var(--icon-url-key-return, url("/icons/key-return.svg"));
}

.svg-key {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-key, url("/icons/key.svg"));
          mask: var(--icon-url-key, url("/icons/key.svg"));
}

.svg-keyboard {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-keyboard, url("/icons/keyboard.svg"));
          mask: var(--icon-url-keyboard, url("/icons/keyboard.svg"));
}

.svg-keyhole {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-keyhole, url("/icons/keyhole.svg"));
          mask: var(--icon-url-keyhole, url("/icons/keyhole.svg"));
}

.svg-knife {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-knife, url("/icons/knife.svg"));
          mask: var(--icon-url-knife, url("/icons/knife.svg"));
}

.svg-ladder-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ladder-simple, url("/icons/ladder-simple.svg"));
          mask: var(--icon-url-ladder-simple, url("/icons/ladder-simple.svg"));
}

.svg-ladder {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ladder, url("/icons/ladder.svg"));
          mask: var(--icon-url-ladder, url("/icons/ladder.svg"));
}

.svg-lamp-pendant {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lamp-pendant, url("/icons/lamp-pendant.svg"));
          mask: var(--icon-url-lamp-pendant, url("/icons/lamp-pendant.svg"));
}

.svg-lamp {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lamp, url("/icons/lamp.svg"));
          mask: var(--icon-url-lamp, url("/icons/lamp.svg"));
}

.svg-laptop {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-laptop, url("/icons/laptop.svg"));
          mask: var(--icon-url-laptop, url("/icons/laptop.svg"));
}

.svg-lasso {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lasso, url("/icons/lasso.svg"));
          mask: var(--icon-url-lasso, url("/icons/lasso.svg"));
}

.svg-lastfm-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lastfm-logo, url("/icons/lastfm-logo.svg"));
          mask: var(--icon-url-lastfm-logo, url("/icons/lastfm-logo.svg"));
}

.svg-layout {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-layout, url("/icons/layout.svg"));
          mask: var(--icon-url-layout, url("/icons/layout.svg"));
}

.svg-leaf {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-leaf, url("/icons/leaf.svg"));
          mask: var(--icon-url-leaf, url("/icons/leaf.svg"));
}

.svg-lectern {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lectern, url("/icons/lectern.svg"));
          mask: var(--icon-url-lectern, url("/icons/lectern.svg"));
}

.svg-lego-smiley {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lego-smiley, url("/icons/lego-smiley.svg"));
          mask: var(--icon-url-lego-smiley, url("/icons/lego-smiley.svg"));
}

.svg-lego {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lego, url("/icons/lego.svg"));
          mask: var(--icon-url-lego, url("/icons/lego.svg"));
}

.svg-less-than-or-equal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-less-than-or-equal, url("/icons/less-than-or-equal.svg"));
          mask: var(--icon-url-less-than-or-equal, url("/icons/less-than-or-equal.svg"));
}

.svg-less-than {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-less-than, url("/icons/less-than.svg"));
          mask: var(--icon-url-less-than, url("/icons/less-than.svg"));
}

.svg-letter-circle-h {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-letter-circle-h, url("/icons/letter-circle-h.svg"));
          mask: var(--icon-url-letter-circle-h, url("/icons/letter-circle-h.svg"));
}

.svg-letter-circle-p {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-letter-circle-p, url("/icons/letter-circle-p.svg"));
          mask: var(--icon-url-letter-circle-p, url("/icons/letter-circle-p.svg"));
}

.svg-letter-circle-v {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-letter-circle-v, url("/icons/letter-circle-v.svg"));
          mask: var(--icon-url-letter-circle-v, url("/icons/letter-circle-v.svg"));
}

.svg-lifebuoy {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lifebuoy, url("/icons/lifebuoy.svg"));
          mask: var(--icon-url-lifebuoy, url("/icons/lifebuoy.svg"));
}

.svg-lightbulb-filament {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lightbulb-filament, url("/icons/lightbulb-filament.svg"));
          mask: var(--icon-url-lightbulb-filament, url("/icons/lightbulb-filament.svg"));
}

.svg-lightbulb {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lightbulb, url("/icons/lightbulb.svg"));
          mask: var(--icon-url-lightbulb, url("/icons/lightbulb.svg"));
}

.svg-lighthouse {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lighthouse, url("/icons/lighthouse.svg"));
          mask: var(--icon-url-lighthouse, url("/icons/lighthouse.svg"));
}

.svg-lightning-a {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lightning-a, url("/icons/lightning-a.svg"));
          mask: var(--icon-url-lightning-a, url("/icons/lightning-a.svg"));
}

.svg-lightning-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lightning-slash, url("/icons/lightning-slash.svg"));
          mask: var(--icon-url-lightning-slash, url("/icons/lightning-slash.svg"));
}

.svg-lightning {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lightning, url("/icons/lightning.svg"));
          mask: var(--icon-url-lightning, url("/icons/lightning.svg"));
}

.svg-line-segment {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-line-segment, url("/icons/line-segment.svg"));
          mask: var(--icon-url-line-segment, url("/icons/line-segment.svg"));
}

.svg-line-segments {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-line-segments, url("/icons/line-segments.svg"));
          mask: var(--icon-url-line-segments, url("/icons/line-segments.svg"));
}

.svg-line-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-line-vertical, url("/icons/line-vertical.svg"));
          mask: var(--icon-url-line-vertical, url("/icons/line-vertical.svg"));
}

.svg-link-break {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-link-break, url("/icons/link-break.svg"));
          mask: var(--icon-url-link-break, url("/icons/link-break.svg"));
}

.svg-link-simple-break {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-link-simple-break, url("/icons/link-simple-break.svg"));
          mask: var(--icon-url-link-simple-break, url("/icons/link-simple-break.svg"));
}

.svg-link-simple-horizontal-break {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-link-simple-horizontal-break, url("/icons/link-simple-horizontal-break.svg"));
          mask: var(--icon-url-link-simple-horizontal-break, url("/icons/link-simple-horizontal-break.svg"));
}

.svg-link-simple-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-link-simple-horizontal, url("/icons/link-simple-horizontal.svg"));
          mask: var(--icon-url-link-simple-horizontal, url("/icons/link-simple-horizontal.svg"));
}

.svg-link-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-link-simple, url("/icons/link-simple.svg"));
          mask: var(--icon-url-link-simple, url("/icons/link-simple.svg"));
}

.svg-link {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-link, url("/icons/link.svg"));
          mask: var(--icon-url-link, url("/icons/link.svg"));
}

.svg-linkedin-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-linkedin-logo, url("/icons/linkedin-logo.svg"));
          mask: var(--icon-url-linkedin-logo, url("/icons/linkedin-logo.svg"));
}

.svg-linktree-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-linktree-logo, url("/icons/linktree-logo.svg"));
          mask: var(--icon-url-linktree-logo, url("/icons/linktree-logo.svg"));
}

.svg-linux-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-linux-logo, url("/icons/linux-logo.svg"));
          mask: var(--icon-url-linux-logo, url("/icons/linux-logo.svg"));
}

.svg-list-bullets {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list-bullets, url("/icons/list-bullets.svg"));
          mask: var(--icon-url-list-bullets, url("/icons/list-bullets.svg"));
}

.svg-list-checks {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list-checks, url("/icons/list-checks.svg"));
          mask: var(--icon-url-list-checks, url("/icons/list-checks.svg"));
}

.svg-list-dashes {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list-dashes, url("/icons/list-dashes.svg"));
          mask: var(--icon-url-list-dashes, url("/icons/list-dashes.svg"));
}

.svg-list-heart {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list-heart, url("/icons/list-heart.svg"));
          mask: var(--icon-url-list-heart, url("/icons/list-heart.svg"));
}

.svg-list-magnifying-glass {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list-magnifying-glass, url("/icons/list-magnifying-glass.svg"));
          mask: var(--icon-url-list-magnifying-glass, url("/icons/list-magnifying-glass.svg"));
}

.svg-list-numbers {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list-numbers, url("/icons/list-numbers.svg"));
          mask: var(--icon-url-list-numbers, url("/icons/list-numbers.svg"));
}

.svg-list-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list-plus, url("/icons/list-plus.svg"));
          mask: var(--icon-url-list-plus, url("/icons/list-plus.svg"));
}

.svg-list-star {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list-star, url("/icons/list-star.svg"));
          mask: var(--icon-url-list-star, url("/icons/list-star.svg"));
}

.svg-list {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-list, url("/icons/list.svg"));
          mask: var(--icon-url-list, url("/icons/list.svg"));
}

.svg-lock-key-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lock-key-open, url("/icons/lock-key-open.svg"));
          mask: var(--icon-url-lock-key-open, url("/icons/lock-key-open.svg"));
}

.svg-lock-key {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lock-key, url("/icons/lock-key.svg"));
          mask: var(--icon-url-lock-key, url("/icons/lock-key.svg"));
}

.svg-lock-laminated-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lock-laminated-open, url("/icons/lock-laminated-open.svg"));
          mask: var(--icon-url-lock-laminated-open, url("/icons/lock-laminated-open.svg"));
}

.svg-lock-laminated {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lock-laminated, url("/icons/lock-laminated.svg"));
          mask: var(--icon-url-lock-laminated, url("/icons/lock-laminated.svg"));
}

.svg-lock-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lock-open, url("/icons/lock-open.svg"));
          mask: var(--icon-url-lock-open, url("/icons/lock-open.svg"));
}

.svg-lock-simple-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lock-simple-open, url("/icons/lock-simple-open.svg"));
          mask: var(--icon-url-lock-simple-open, url("/icons/lock-simple-open.svg"));
}

.svg-lock-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lock-simple, url("/icons/lock-simple.svg"));
          mask: var(--icon-url-lock-simple, url("/icons/lock-simple.svg"));
}

.svg-lock {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lock, url("/icons/lock.svg"));
          mask: var(--icon-url-lock, url("/icons/lock.svg"));
}

.svg-lockers {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-lockers, url("/icons/lockers.svg"));
          mask: var(--icon-url-lockers, url("/icons/lockers.svg"));
}

.svg-log {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-log, url("/icons/log.svg"));
          mask: var(--icon-url-log, url("/icons/log.svg"));
}

.svg-magic-wand {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-magic-wand, url("/icons/magic-wand.svg"));
          mask: var(--icon-url-magic-wand, url("/icons/magic-wand.svg"));
}

.svg-magnet-straight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-magnet-straight, url("/icons/magnet-straight.svg"));
          mask: var(--icon-url-magnet-straight, url("/icons/magnet-straight.svg"));
}

.svg-magnet {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-magnet, url("/icons/magnet.svg"));
          mask: var(--icon-url-magnet, url("/icons/magnet.svg"));
}

.svg-magnifying-glass-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-magnifying-glass-minus, url("/icons/magnifying-glass-minus.svg"));
          mask: var(--icon-url-magnifying-glass-minus, url("/icons/magnifying-glass-minus.svg"));
}

.svg-magnifying-glass-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-magnifying-glass-plus, url("/icons/magnifying-glass-plus.svg"));
          mask: var(--icon-url-magnifying-glass-plus, url("/icons/magnifying-glass-plus.svg"));
}

.svg-magnifying-glass {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-magnifying-glass, url("/icons/magnifying-glass.svg"));
          mask: var(--icon-url-magnifying-glass, url("/icons/magnifying-glass.svg"));
}

.svg-mailbox {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mailbox, url("/icons/mailbox.svg"));
          mask: var(--icon-url-mailbox, url("/icons/mailbox.svg"));
}

.svg-map-pin-area {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-map-pin-area, url("/icons/map-pin-area.svg"));
          mask: var(--icon-url-map-pin-area, url("/icons/map-pin-area.svg"));
}

.svg-map-pin-line {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-map-pin-line, url("/icons/map-pin-line.svg"));
          mask: var(--icon-url-map-pin-line, url("/icons/map-pin-line.svg"));
}

.svg-map-pin-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-map-pin-plus, url("/icons/map-pin-plus.svg"));
          mask: var(--icon-url-map-pin-plus, url("/icons/map-pin-plus.svg"));
}

.svg-map-pin-simple-area {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-map-pin-simple-area, url("/icons/map-pin-simple-area.svg"));
          mask: var(--icon-url-map-pin-simple-area, url("/icons/map-pin-simple-area.svg"));
}

.svg-map-pin-simple-line {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-map-pin-simple-line, url("/icons/map-pin-simple-line.svg"));
          mask: var(--icon-url-map-pin-simple-line, url("/icons/map-pin-simple-line.svg"));
}

.svg-map-pin-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-map-pin-simple, url("/icons/map-pin-simple.svg"));
          mask: var(--icon-url-map-pin-simple, url("/icons/map-pin-simple.svg"));
}

.svg-map-pin {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-map-pin, url("/icons/map-pin.svg"));
          mask: var(--icon-url-map-pin, url("/icons/map-pin.svg"));
}

.svg-map-trifold {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-map-trifold, url("/icons/map-trifold.svg"));
          mask: var(--icon-url-map-trifold, url("/icons/map-trifold.svg"));
}

.svg-markdown-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-markdown-logo, url("/icons/markdown-logo.svg"));
          mask: var(--icon-url-markdown-logo, url("/icons/markdown-logo.svg"));
}

.svg-marker-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-marker-circle, url("/icons/marker-circle.svg"));
          mask: var(--icon-url-marker-circle, url("/icons/marker-circle.svg"));
}

.svg-martini {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-martini, url("/icons/martini.svg"));
          mask: var(--icon-url-martini, url("/icons/martini.svg"));
}

.svg-mask-happy {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mask-happy, url("/icons/mask-happy.svg"));
          mask: var(--icon-url-mask-happy, url("/icons/mask-happy.svg"));
}

.svg-mask-sad {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mask-sad, url("/icons/mask-sad.svg"));
          mask: var(--icon-url-mask-sad, url("/icons/mask-sad.svg"));
}

.svg-mastodon-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mastodon-logo, url("/icons/mastodon-logo.svg"));
          mask: var(--icon-url-mastodon-logo, url("/icons/mastodon-logo.svg"));
}

.svg-math-operations {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-math-operations, url("/icons/math-operations.svg"));
          mask: var(--icon-url-math-operations, url("/icons/math-operations.svg"));
}

.svg-matrix-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-matrix-logo, url("/icons/matrix-logo.svg"));
          mask: var(--icon-url-matrix-logo, url("/icons/matrix-logo.svg"));
}

.svg-medal-military {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-medal-military, url("/icons/medal-military.svg"));
          mask: var(--icon-url-medal-military, url("/icons/medal-military.svg"));
}

.svg-medal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-medal, url("/icons/medal.svg"));
          mask: var(--icon-url-medal, url("/icons/medal.svg"));
}

.svg-medium-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-medium-logo, url("/icons/medium-logo.svg"));
          mask: var(--icon-url-medium-logo, url("/icons/medium-logo.svg"));
}

.svg-megaphone-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-megaphone-simple, url("/icons/megaphone-simple.svg"));
          mask: var(--icon-url-megaphone-simple, url("/icons/megaphone-simple.svg"));
}

.svg-megaphone {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-megaphone, url("/icons/megaphone.svg"));
          mask: var(--icon-url-megaphone, url("/icons/megaphone.svg"));
}

.svg-member-of {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-member-of, url("/icons/member-of.svg"));
          mask: var(--icon-url-member-of, url("/icons/member-of.svg"));
}

.svg-memory {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-memory, url("/icons/memory.svg"));
          mask: var(--icon-url-memory, url("/icons/memory.svg"));
}

.svg-messenger-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-messenger-logo, url("/icons/messenger-logo.svg"));
          mask: var(--icon-url-messenger-logo, url("/icons/messenger-logo.svg"));
}

.svg-meta-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-meta-logo, url("/icons/meta-logo.svg"));
          mask: var(--icon-url-meta-logo, url("/icons/meta-logo.svg"));
}

.svg-meteor {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-meteor, url("/icons/meteor.svg"));
          mask: var(--icon-url-meteor, url("/icons/meteor.svg"));
}

.svg-metronome {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-metronome, url("/icons/metronome.svg"));
          mask: var(--icon-url-metronome, url("/icons/metronome.svg"));
}

.svg-microphone-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microphone-slash, url("/icons/microphone-slash.svg"));
          mask: var(--icon-url-microphone-slash, url("/icons/microphone-slash.svg"));
}

.svg-microphone-stage {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microphone-stage, url("/icons/microphone-stage.svg"));
          mask: var(--icon-url-microphone-stage, url("/icons/microphone-stage.svg"));
}

.svg-microphone {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microphone, url("/icons/microphone.svg"));
          mask: var(--icon-url-microphone, url("/icons/microphone.svg"));
}

.svg-microscope {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microscope, url("/icons/microscope.svg"));
          mask: var(--icon-url-microscope, url("/icons/microscope.svg"));
}

.svg-microsoft-excel-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microsoft-excel-logo, url("/icons/microsoft-excel-logo.svg"));
          mask: var(--icon-url-microsoft-excel-logo, url("/icons/microsoft-excel-logo.svg"));
}

.svg-microsoft-outlook-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microsoft-outlook-logo, url("/icons/microsoft-outlook-logo.svg"));
          mask: var(--icon-url-microsoft-outlook-logo, url("/icons/microsoft-outlook-logo.svg"));
}

.svg-microsoft-powerpoint-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microsoft-powerpoint-logo, url("/icons/microsoft-powerpoint-logo.svg"));
          mask: var(--icon-url-microsoft-powerpoint-logo, url("/icons/microsoft-powerpoint-logo.svg"));
}

.svg-microsoft-teams-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microsoft-teams-logo, url("/icons/microsoft-teams-logo.svg"));
          mask: var(--icon-url-microsoft-teams-logo, url("/icons/microsoft-teams-logo.svg"));
}

.svg-microsoft-word-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-microsoft-word-logo, url("/icons/microsoft-word-logo.svg"));
          mask: var(--icon-url-microsoft-word-logo, url("/icons/microsoft-word-logo.svg"));
}

.svg-minus-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-minus-circle, url("/icons/minus-circle.svg"));
          mask: var(--icon-url-minus-circle, url("/icons/minus-circle.svg"));
}

.svg-minus-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-minus-square, url("/icons/minus-square.svg"));
          mask: var(--icon-url-minus-square, url("/icons/minus-square.svg"));
}

.svg-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-minus, url("/icons/minus.svg"));
          mask: var(--icon-url-minus, url("/icons/minus.svg"));
}

.svg-money-wavy {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-money-wavy, url("/icons/money-wavy.svg"));
          mask: var(--icon-url-money-wavy, url("/icons/money-wavy.svg"));
}

.svg-money {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-money, url("/icons/money.svg"));
          mask: var(--icon-url-money, url("/icons/money.svg"));
}

.svg-monitor-arrow-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-monitor-arrow-up, url("/icons/monitor-arrow-up.svg"));
          mask: var(--icon-url-monitor-arrow-up, url("/icons/monitor-arrow-up.svg"));
}

.svg-monitor-play {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-monitor-play, url("/icons/monitor-play.svg"));
          mask: var(--icon-url-monitor-play, url("/icons/monitor-play.svg"));
}

.svg-monitor {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-monitor, url("/icons/monitor.svg"));
          mask: var(--icon-url-monitor, url("/icons/monitor.svg"));
}

.svg-moon-stars {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-moon-stars, url("/icons/moon-stars.svg"));
          mask: var(--icon-url-moon-stars, url("/icons/moon-stars.svg"));
}

.svg-moon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-moon, url("/icons/moon.svg"));
          mask: var(--icon-url-moon, url("/icons/moon.svg"));
}

.svg-moped-front {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-moped-front, url("/icons/moped-front.svg"));
          mask: var(--icon-url-moped-front, url("/icons/moped-front.svg"));
}

.svg-moped {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-moped, url("/icons/moped.svg"));
          mask: var(--icon-url-moped, url("/icons/moped.svg"));
}

.svg-mosque {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mosque, url("/icons/mosque.svg"));
          mask: var(--icon-url-mosque, url("/icons/mosque.svg"));
}

.svg-motorcycle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-motorcycle, url("/icons/motorcycle.svg"));
          mask: var(--icon-url-motorcycle, url("/icons/motorcycle.svg"));
}

.svg-mountains {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mountains, url("/icons/mountains.svg"));
          mask: var(--icon-url-mountains, url("/icons/mountains.svg"));
}

.svg-mouse-left-click {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mouse-left-click, url("/icons/mouse-left-click.svg"));
          mask: var(--icon-url-mouse-left-click, url("/icons/mouse-left-click.svg"));
}

.svg-mouse-middle-click {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mouse-middle-click, url("/icons/mouse-middle-click.svg"));
          mask: var(--icon-url-mouse-middle-click, url("/icons/mouse-middle-click.svg"));
}

.svg-mouse-right-click {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mouse-right-click, url("/icons/mouse-right-click.svg"));
          mask: var(--icon-url-mouse-right-click, url("/icons/mouse-right-click.svg"));
}

.svg-mouse-scroll {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mouse-scroll, url("/icons/mouse-scroll.svg"));
          mask: var(--icon-url-mouse-scroll, url("/icons/mouse-scroll.svg"));
}

.svg-mouse-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mouse-simple, url("/icons/mouse-simple.svg"));
          mask: var(--icon-url-mouse-simple, url("/icons/mouse-simple.svg"));
}

.svg-mouse {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-mouse, url("/icons/mouse.svg"));
          mask: var(--icon-url-mouse, url("/icons/mouse.svg"));
}

.svg-music-note-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-music-note-simple, url("/icons/music-note-simple.svg"));
          mask: var(--icon-url-music-note-simple, url("/icons/music-note-simple.svg"));
}

.svg-music-note {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-music-note, url("/icons/music-note.svg"));
          mask: var(--icon-url-music-note, url("/icons/music-note.svg"));
}

.svg-music-notes-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-music-notes-minus, url("/icons/music-notes-minus.svg"));
          mask: var(--icon-url-music-notes-minus, url("/icons/music-notes-minus.svg"));
}

.svg-music-notes-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-music-notes-plus, url("/icons/music-notes-plus.svg"));
          mask: var(--icon-url-music-notes-plus, url("/icons/music-notes-plus.svg"));
}

.svg-music-notes-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-music-notes-simple, url("/icons/music-notes-simple.svg"));
          mask: var(--icon-url-music-notes-simple, url("/icons/music-notes-simple.svg"));
}

.svg-music-notes {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-music-notes, url("/icons/music-notes.svg"));
          mask: var(--icon-url-music-notes, url("/icons/music-notes.svg"));
}

.svg-navigation-arrow {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-navigation-arrow, url("/icons/navigation-arrow.svg"));
          mask: var(--icon-url-navigation-arrow, url("/icons/navigation-arrow.svg"));
}

.svg-needle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-needle, url("/icons/needle.svg"));
          mask: var(--icon-url-needle, url("/icons/needle.svg"));
}

.svg-network-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-network-slash, url("/icons/network-slash.svg"));
          mask: var(--icon-url-network-slash, url("/icons/network-slash.svg"));
}

.svg-network-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-network-x, url("/icons/network-x.svg"));
          mask: var(--icon-url-network-x, url("/icons/network-x.svg"));
}

.svg-network {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-network, url("/icons/network.svg"));
          mask: var(--icon-url-network, url("/icons/network.svg"));
}

.svg-newspaper-clipping {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-newspaper-clipping, url("/icons/newspaper-clipping.svg"));
          mask: var(--icon-url-newspaper-clipping, url("/icons/newspaper-clipping.svg"));
}

.svg-newspaper {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-newspaper, url("/icons/newspaper.svg"));
          mask: var(--icon-url-newspaper, url("/icons/newspaper.svg"));
}

.svg-not-equals {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-not-equals, url("/icons/not-equals.svg"));
          mask: var(--icon-url-not-equals, url("/icons/not-equals.svg"));
}

.svg-not-member-of {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-not-member-of, url("/icons/not-member-of.svg"));
          mask: var(--icon-url-not-member-of, url("/icons/not-member-of.svg"));
}

.svg-not-subset-of {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-not-subset-of, url("/icons/not-subset-of.svg"));
          mask: var(--icon-url-not-subset-of, url("/icons/not-subset-of.svg"));
}

.svg-not-superset-of {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-not-superset-of, url("/icons/not-superset-of.svg"));
          mask: var(--icon-url-not-superset-of, url("/icons/not-superset-of.svg"));
}

.svg-notches {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-notches, url("/icons/notches.svg"));
          mask: var(--icon-url-notches, url("/icons/notches.svg"));
}

.svg-note-blank {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-note-blank, url("/icons/note-blank.svg"));
          mask: var(--icon-url-note-blank, url("/icons/note-blank.svg"));
}

.svg-note-pencil {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-note-pencil, url("/icons/note-pencil.svg"));
          mask: var(--icon-url-note-pencil, url("/icons/note-pencil.svg"));
}

.svg-note {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-note, url("/icons/note.svg"));
          mask: var(--icon-url-note, url("/icons/note.svg"));
}

.svg-notebook {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-notebook, url("/icons/notebook.svg"));
          mask: var(--icon-url-notebook, url("/icons/notebook.svg"));
}

.svg-notepad {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-notepad, url("/icons/notepad.svg"));
          mask: var(--icon-url-notepad, url("/icons/notepad.svg"));
}

.svg-notification {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-notification, url("/icons/notification.svg"));
          mask: var(--icon-url-notification, url("/icons/notification.svg"));
}

.svg-notion-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-notion-logo, url("/icons/notion-logo.svg"));
          mask: var(--icon-url-notion-logo, url("/icons/notion-logo.svg"));
}

.svg-nuclear-plant {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-nuclear-plant, url("/icons/nuclear-plant.svg"));
          mask: var(--icon-url-nuclear-plant, url("/icons/nuclear-plant.svg"));
}

.svg-number-circle-eight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-eight, url("/icons/number-circle-eight.svg"));
          mask: var(--icon-url-number-circle-eight, url("/icons/number-circle-eight.svg"));
}

.svg-number-circle-five {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-five, url("/icons/number-circle-five.svg"));
          mask: var(--icon-url-number-circle-five, url("/icons/number-circle-five.svg"));
}

.svg-number-circle-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-four, url("/icons/number-circle-four.svg"));
          mask: var(--icon-url-number-circle-four, url("/icons/number-circle-four.svg"));
}

.svg-number-circle-nine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-nine, url("/icons/number-circle-nine.svg"));
          mask: var(--icon-url-number-circle-nine, url("/icons/number-circle-nine.svg"));
}

.svg-number-circle-one {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-one, url("/icons/number-circle-one.svg"));
          mask: var(--icon-url-number-circle-one, url("/icons/number-circle-one.svg"));
}

.svg-number-circle-seven {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-seven, url("/icons/number-circle-seven.svg"));
          mask: var(--icon-url-number-circle-seven, url("/icons/number-circle-seven.svg"));
}

.svg-number-circle-six {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-six, url("/icons/number-circle-six.svg"));
          mask: var(--icon-url-number-circle-six, url("/icons/number-circle-six.svg"));
}

.svg-number-circle-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-three, url("/icons/number-circle-three.svg"));
          mask: var(--icon-url-number-circle-three, url("/icons/number-circle-three.svg"));
}

.svg-number-circle-two {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-two, url("/icons/number-circle-two.svg"));
          mask: var(--icon-url-number-circle-two, url("/icons/number-circle-two.svg"));
}

.svg-number-circle-zero {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-circle-zero, url("/icons/number-circle-zero.svg"));
          mask: var(--icon-url-number-circle-zero, url("/icons/number-circle-zero.svg"));
}

.svg-number-eight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-eight, url("/icons/number-eight.svg"));
          mask: var(--icon-url-number-eight, url("/icons/number-eight.svg"));
}

.svg-number-five {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-five, url("/icons/number-five.svg"));
          mask: var(--icon-url-number-five, url("/icons/number-five.svg"));
}

.svg-number-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-four, url("/icons/number-four.svg"));
          mask: var(--icon-url-number-four, url("/icons/number-four.svg"));
}

.svg-number-nine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-nine, url("/icons/number-nine.svg"));
          mask: var(--icon-url-number-nine, url("/icons/number-nine.svg"));
}

.svg-number-one {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-one, url("/icons/number-one.svg"));
          mask: var(--icon-url-number-one, url("/icons/number-one.svg"));
}

.svg-number-seven {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-seven, url("/icons/number-seven.svg"));
          mask: var(--icon-url-number-seven, url("/icons/number-seven.svg"));
}

.svg-number-six {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-six, url("/icons/number-six.svg"));
          mask: var(--icon-url-number-six, url("/icons/number-six.svg"));
}

.svg-number-square-eight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-eight, url("/icons/number-square-eight.svg"));
          mask: var(--icon-url-number-square-eight, url("/icons/number-square-eight.svg"));
}

.svg-number-square-five {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-five, url("/icons/number-square-five.svg"));
          mask: var(--icon-url-number-square-five, url("/icons/number-square-five.svg"));
}

.svg-number-square-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-four, url("/icons/number-square-four.svg"));
          mask: var(--icon-url-number-square-four, url("/icons/number-square-four.svg"));
}

.svg-number-square-nine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-nine, url("/icons/number-square-nine.svg"));
          mask: var(--icon-url-number-square-nine, url("/icons/number-square-nine.svg"));
}

.svg-number-square-one {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-one, url("/icons/number-square-one.svg"));
          mask: var(--icon-url-number-square-one, url("/icons/number-square-one.svg"));
}

.svg-number-square-seven {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-seven, url("/icons/number-square-seven.svg"));
          mask: var(--icon-url-number-square-seven, url("/icons/number-square-seven.svg"));
}

.svg-number-square-six {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-six, url("/icons/number-square-six.svg"));
          mask: var(--icon-url-number-square-six, url("/icons/number-square-six.svg"));
}

.svg-number-square-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-three, url("/icons/number-square-three.svg"));
          mask: var(--icon-url-number-square-three, url("/icons/number-square-three.svg"));
}

.svg-number-square-two {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-two, url("/icons/number-square-two.svg"));
          mask: var(--icon-url-number-square-two, url("/icons/number-square-two.svg"));
}

.svg-number-square-zero {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-square-zero, url("/icons/number-square-zero.svg"));
          mask: var(--icon-url-number-square-zero, url("/icons/number-square-zero.svg"));
}

.svg-number-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-three, url("/icons/number-three.svg"));
          mask: var(--icon-url-number-three, url("/icons/number-three.svg"));
}

.svg-number-two {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-two, url("/icons/number-two.svg"));
          mask: var(--icon-url-number-two, url("/icons/number-two.svg"));
}

.svg-number-zero {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-number-zero, url("/icons/number-zero.svg"));
          mask: var(--icon-url-number-zero, url("/icons/number-zero.svg"));
}

.svg-numpad {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-numpad, url("/icons/numpad.svg"));
          mask: var(--icon-url-numpad, url("/icons/numpad.svg"));
}

.svg-nut {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-nut, url("/icons/nut.svg"));
          mask: var(--icon-url-nut, url("/icons/nut.svg"));
}

.svg-ny-times-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ny-times-logo, url("/icons/ny-times-logo.svg"));
          mask: var(--icon-url-ny-times-logo, url("/icons/ny-times-logo.svg"));
}

.svg-octagon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-octagon, url("/icons/octagon.svg"));
          mask: var(--icon-url-octagon, url("/icons/octagon.svg"));
}

.svg-office-chair {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-office-chair, url("/icons/office-chair.svg"));
          mask: var(--icon-url-office-chair, url("/icons/office-chair.svg"));
}

.svg-onigiri {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-onigiri, url("/icons/onigiri.svg"));
          mask: var(--icon-url-onigiri, url("/icons/onigiri.svg"));
}

.svg-open-ai-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-open-ai-logo, url("/icons/open-ai-logo.svg"));
          mask: var(--icon-url-open-ai-logo, url("/icons/open-ai-logo.svg"));
}

.svg-option {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-option, url("/icons/option.svg"));
          mask: var(--icon-url-option, url("/icons/option.svg"));
}

.svg-orange-slice {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-orange-slice, url("/icons/orange-slice.svg"));
          mask: var(--icon-url-orange-slice, url("/icons/orange-slice.svg"));
}

.svg-orange {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-orange, url("/icons/orange.svg"));
          mask: var(--icon-url-orange, url("/icons/orange.svg"));
}

.svg-oven {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-oven, url("/icons/oven.svg"));
          mask: var(--icon-url-oven, url("/icons/oven.svg"));
}

.svg-package {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-package, url("/icons/package.svg"));
          mask: var(--icon-url-package, url("/icons/package.svg"));
}

.svg-paint-brush-broad {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paint-brush-broad, url("/icons/paint-brush-broad.svg"));
          mask: var(--icon-url-paint-brush-broad, url("/icons/paint-brush-broad.svg"));
}

.svg-paint-brush-household {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paint-brush-household, url("/icons/paint-brush-household.svg"));
          mask: var(--icon-url-paint-brush-household, url("/icons/paint-brush-household.svg"));
}

.svg-paint-brush {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paint-brush, url("/icons/paint-brush.svg"));
          mask: var(--icon-url-paint-brush, url("/icons/paint-brush.svg"));
}

.svg-paint-bucket {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paint-bucket, url("/icons/paint-bucket.svg"));
          mask: var(--icon-url-paint-bucket, url("/icons/paint-bucket.svg"));
}

.svg-paint-roller {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paint-roller, url("/icons/paint-roller.svg"));
          mask: var(--icon-url-paint-roller, url("/icons/paint-roller.svg"));
}

.svg-palette {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-palette, url("/icons/palette.svg"));
          mask: var(--icon-url-palette, url("/icons/palette.svg"));
}

.svg-panorama {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-panorama, url("/icons/panorama.svg"));
          mask: var(--icon-url-panorama, url("/icons/panorama.svg"));
}

.svg-pants {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pants, url("/icons/pants.svg"));
          mask: var(--icon-url-pants, url("/icons/pants.svg"));
}

.svg-paper-plane-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paper-plane-right, url("/icons/paper-plane-right.svg"));
          mask: var(--icon-url-paper-plane-right, url("/icons/paper-plane-right.svg"));
}

.svg-paper-plane-tilt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paper-plane-tilt, url("/icons/paper-plane-tilt.svg"));
          mask: var(--icon-url-paper-plane-tilt, url("/icons/paper-plane-tilt.svg"));
}

.svg-paper-plane {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paper-plane, url("/icons/paper-plane.svg"));
          mask: var(--icon-url-paper-plane, url("/icons/paper-plane.svg"));
}

.svg-paperclip-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paperclip-horizontal, url("/icons/paperclip-horizontal.svg"));
          mask: var(--icon-url-paperclip-horizontal, url("/icons/paperclip-horizontal.svg"));
}

.svg-paperclip {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paperclip, url("/icons/paperclip.svg"));
          mask: var(--icon-url-paperclip, url("/icons/paperclip.svg"));
}

.svg-parachute {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-parachute, url("/icons/parachute.svg"));
          mask: var(--icon-url-parachute, url("/icons/parachute.svg"));
}

.svg-paragraph {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paragraph, url("/icons/paragraph.svg"));
          mask: var(--icon-url-paragraph, url("/icons/paragraph.svg"));
}

.svg-parallelogram {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-parallelogram, url("/icons/parallelogram.svg"));
          mask: var(--icon-url-parallelogram, url("/icons/parallelogram.svg"));
}

.svg-park {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-park, url("/icons/park.svg"));
          mask: var(--icon-url-park, url("/icons/park.svg"));
}

.svg-password {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-password, url("/icons/password.svg"));
          mask: var(--icon-url-password, url("/icons/password.svg"));
}

.svg-path {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-path, url("/icons/path.svg"));
          mask: var(--icon-url-path, url("/icons/path.svg"));
}

.svg-patreon-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-patreon-logo, url("/icons/patreon-logo.svg"));
          mask: var(--icon-url-patreon-logo, url("/icons/patreon-logo.svg"));
}

.svg-pause-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pause-circle, url("/icons/pause-circle.svg"));
          mask: var(--icon-url-pause-circle, url("/icons/pause-circle.svg"));
}

.svg-pause {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pause, url("/icons/pause.svg"));
          mask: var(--icon-url-pause, url("/icons/pause.svg"));
}

.svg-paw-print {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paw-print, url("/icons/paw-print.svg"));
          mask: var(--icon-url-paw-print, url("/icons/paw-print.svg"));
}

.svg-paypal-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-paypal-logo, url("/icons/paypal-logo.svg"));
          mask: var(--icon-url-paypal-logo, url("/icons/paypal-logo.svg"));
}

.svg-peace {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-peace, url("/icons/peace.svg"));
          mask: var(--icon-url-peace, url("/icons/peace.svg"));
}

.svg-pen-nib-straight {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pen-nib-straight, url("/icons/pen-nib-straight.svg"));
          mask: var(--icon-url-pen-nib-straight, url("/icons/pen-nib-straight.svg"));
}

.svg-pen-nib {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pen-nib, url("/icons/pen-nib.svg"));
          mask: var(--icon-url-pen-nib, url("/icons/pen-nib.svg"));
}

.svg-pen {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pen, url("/icons/pen.svg"));
          mask: var(--icon-url-pen, url("/icons/pen.svg"));
}

.svg-pencil-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pencil-circle, url("/icons/pencil-circle.svg"));
          mask: var(--icon-url-pencil-circle, url("/icons/pencil-circle.svg"));
}

.svg-pencil-line {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pencil-line, url("/icons/pencil-line.svg"));
          mask: var(--icon-url-pencil-line, url("/icons/pencil-line.svg"));
}

.svg-pencil-ruler {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pencil-ruler, url("/icons/pencil-ruler.svg"));
          mask: var(--icon-url-pencil-ruler, url("/icons/pencil-ruler.svg"));
}

.svg-pencil-simple-line {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pencil-simple-line, url("/icons/pencil-simple-line.svg"));
          mask: var(--icon-url-pencil-simple-line, url("/icons/pencil-simple-line.svg"));
}

.svg-pencil-simple-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pencil-simple-slash, url("/icons/pencil-simple-slash.svg"));
          mask: var(--icon-url-pencil-simple-slash, url("/icons/pencil-simple-slash.svg"));
}

.svg-pencil-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pencil-simple, url("/icons/pencil-simple.svg"));
          mask: var(--icon-url-pencil-simple, url("/icons/pencil-simple.svg"));
}

.svg-pencil-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pencil-slash, url("/icons/pencil-slash.svg"));
          mask: var(--icon-url-pencil-slash, url("/icons/pencil-slash.svg"));
}

.svg-pencil {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pencil, url("/icons/pencil.svg"));
          mask: var(--icon-url-pencil, url("/icons/pencil.svg"));
}

.svg-pentagon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pentagon, url("/icons/pentagon.svg"));
          mask: var(--icon-url-pentagon, url("/icons/pentagon.svg"));
}

.svg-pentagram {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pentagram, url("/icons/pentagram.svg"));
          mask: var(--icon-url-pentagram, url("/icons/pentagram.svg"));
}

.svg-pepper {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pepper, url("/icons/pepper.svg"));
          mask: var(--icon-url-pepper, url("/icons/pepper.svg"));
}

.svg-percent {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-percent, url("/icons/percent.svg"));
          mask: var(--icon-url-percent, url("/icons/percent.svg"));
}

.svg-person-arms-spread {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-arms-spread, url("/icons/person-arms-spread.svg"));
          mask: var(--icon-url-person-arms-spread, url("/icons/person-arms-spread.svg"));
}

.svg-person-simple-bike {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-bike, url("/icons/person-simple-bike.svg"));
          mask: var(--icon-url-person-simple-bike, url("/icons/person-simple-bike.svg"));
}

.svg-person-simple-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-circle, url("/icons/person-simple-circle.svg"));
          mask: var(--icon-url-person-simple-circle, url("/icons/person-simple-circle.svg"));
}

.svg-person-simple-hike {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-hike, url("/icons/person-simple-hike.svg"));
          mask: var(--icon-url-person-simple-hike, url("/icons/person-simple-hike.svg"));
}

.svg-person-simple-run {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-run, url("/icons/person-simple-run.svg"));
          mask: var(--icon-url-person-simple-run, url("/icons/person-simple-run.svg"));
}

.svg-person-simple-ski {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-ski, url("/icons/person-simple-ski.svg"));
          mask: var(--icon-url-person-simple-ski, url("/icons/person-simple-ski.svg"));
}

.svg-person-simple-snowboard {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-snowboard, url("/icons/person-simple-snowboard.svg"));
          mask: var(--icon-url-person-simple-snowboard, url("/icons/person-simple-snowboard.svg"));
}

.svg-person-simple-swim {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-swim, url("/icons/person-simple-swim.svg"));
          mask: var(--icon-url-person-simple-swim, url("/icons/person-simple-swim.svg"));
}

.svg-person-simple-tai-chi {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-tai-chi, url("/icons/person-simple-tai-chi.svg"));
          mask: var(--icon-url-person-simple-tai-chi, url("/icons/person-simple-tai-chi.svg"));
}

.svg-person-simple-throw {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-throw, url("/icons/person-simple-throw.svg"));
          mask: var(--icon-url-person-simple-throw, url("/icons/person-simple-throw.svg"));
}

.svg-person-simple-walk {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple-walk, url("/icons/person-simple-walk.svg"));
          mask: var(--icon-url-person-simple-walk, url("/icons/person-simple-walk.svg"));
}

.svg-person-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person-simple, url("/icons/person-simple.svg"));
          mask: var(--icon-url-person-simple, url("/icons/person-simple.svg"));
}

.svg-person {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-person, url("/icons/person.svg"));
          mask: var(--icon-url-person, url("/icons/person.svg"));
}

.svg-perspective {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-perspective, url("/icons/perspective.svg"));
          mask: var(--icon-url-perspective, url("/icons/perspective.svg"));
}

.svg-phone-call {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-call, url("/icons/phone-call.svg"));
          mask: var(--icon-url-phone-call, url("/icons/phone-call.svg"));
}

.svg-phone-disconnect {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-disconnect, url("/icons/phone-disconnect.svg"));
          mask: var(--icon-url-phone-disconnect, url("/icons/phone-disconnect.svg"));
}

.svg-phone-incoming {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-incoming, url("/icons/phone-incoming.svg"));
          mask: var(--icon-url-phone-incoming, url("/icons/phone-incoming.svg"));
}

.svg-phone-list {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-list, url("/icons/phone-list.svg"));
          mask: var(--icon-url-phone-list, url("/icons/phone-list.svg"));
}

.svg-phone-outgoing {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-outgoing, url("/icons/phone-outgoing.svg"));
          mask: var(--icon-url-phone-outgoing, url("/icons/phone-outgoing.svg"));
}

.svg-phone-pause {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-pause, url("/icons/phone-pause.svg"));
          mask: var(--icon-url-phone-pause, url("/icons/phone-pause.svg"));
}

.svg-phone-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-plus, url("/icons/phone-plus.svg"));
          mask: var(--icon-url-phone-plus, url("/icons/phone-plus.svg"));
}

.svg-phone-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-slash, url("/icons/phone-slash.svg"));
          mask: var(--icon-url-phone-slash, url("/icons/phone-slash.svg"));
}

.svg-phone-transfer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-transfer, url("/icons/phone-transfer.svg"));
          mask: var(--icon-url-phone-transfer, url("/icons/phone-transfer.svg"));
}

.svg-phone-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone-x, url("/icons/phone-x.svg"));
          mask: var(--icon-url-phone-x, url("/icons/phone-x.svg"));
}

.svg-phone {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phone, url("/icons/phone.svg"));
          mask: var(--icon-url-phone, url("/icons/phone.svg"));
}

.svg-phosphor-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-phosphor-logo, url("/icons/phosphor-logo.svg"));
          mask: var(--icon-url-phosphor-logo, url("/icons/phosphor-logo.svg"));
}

.svg-pi {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pi, url("/icons/pi.svg"));
          mask: var(--icon-url-pi, url("/icons/pi.svg"));
}

.svg-piano-keys {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-piano-keys, url("/icons/piano-keys.svg"));
          mask: var(--icon-url-piano-keys, url("/icons/piano-keys.svg"));
}

.svg-picnic-table {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-picnic-table, url("/icons/picnic-table.svg"));
          mask: var(--icon-url-picnic-table, url("/icons/picnic-table.svg"));
}

.svg-picture-in-picture {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-picture-in-picture, url("/icons/picture-in-picture.svg"));
          mask: var(--icon-url-picture-in-picture, url("/icons/picture-in-picture.svg"));
}

.svg-piggy-bank {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-piggy-bank, url("/icons/piggy-bank.svg"));
          mask: var(--icon-url-piggy-bank, url("/icons/piggy-bank.svg"));
}

.svg-pill {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pill, url("/icons/pill.svg"));
          mask: var(--icon-url-pill, url("/icons/pill.svg"));
}

.svg-ping-pong {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ping-pong, url("/icons/ping-pong.svg"));
          mask: var(--icon-url-ping-pong, url("/icons/ping-pong.svg"));
}

.svg-pint-glass {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pint-glass, url("/icons/pint-glass.svg"));
          mask: var(--icon-url-pint-glass, url("/icons/pint-glass.svg"));
}

.svg-pinterest-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pinterest-logo, url("/icons/pinterest-logo.svg"));
          mask: var(--icon-url-pinterest-logo, url("/icons/pinterest-logo.svg"));
}

.svg-pinwheel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pinwheel, url("/icons/pinwheel.svg"));
          mask: var(--icon-url-pinwheel, url("/icons/pinwheel.svg"));
}

.svg-pipe-wrench {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pipe-wrench, url("/icons/pipe-wrench.svg"));
          mask: var(--icon-url-pipe-wrench, url("/icons/pipe-wrench.svg"));
}

.svg-pipe {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pipe, url("/icons/pipe.svg"));
          mask: var(--icon-url-pipe, url("/icons/pipe.svg"));
}

.svg-pix-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pix-logo, url("/icons/pix-logo.svg"));
          mask: var(--icon-url-pix-logo, url("/icons/pix-logo.svg"));
}

.svg-pizza {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pizza, url("/icons/pizza.svg"));
          mask: var(--icon-url-pizza, url("/icons/pizza.svg"));
}

.svg-placeholder {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-placeholder, url("/icons/placeholder.svg"));
          mask: var(--icon-url-placeholder, url("/icons/placeholder.svg"));
}

.svg-planet {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-planet, url("/icons/planet.svg"));
          mask: var(--icon-url-planet, url("/icons/planet.svg"));
}

.svg-plant {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plant, url("/icons/plant.svg"));
          mask: var(--icon-url-plant, url("/icons/plant.svg"));
}

.svg-play-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-play-circle, url("/icons/play-circle.svg"));
          mask: var(--icon-url-play-circle, url("/icons/play-circle.svg"));
}

.svg-play-pause {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-play-pause, url("/icons/play-pause.svg"));
          mask: var(--icon-url-play-pause, url("/icons/play-pause.svg"));
}

.svg-play {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-play, url("/icons/play.svg"));
          mask: var(--icon-url-play, url("/icons/play.svg"));
}

.svg-playlist {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-playlist, url("/icons/playlist.svg"));
          mask: var(--icon-url-playlist, url("/icons/playlist.svg"));
}

.svg-plug-charging {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plug-charging, url("/icons/plug-charging.svg"));
          mask: var(--icon-url-plug-charging, url("/icons/plug-charging.svg"));
}

.svg-plug {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plug, url("/icons/plug.svg"));
          mask: var(--icon-url-plug, url("/icons/plug.svg"));
}

.svg-plugs-connected {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plugs-connected, url("/icons/plugs-connected.svg"));
          mask: var(--icon-url-plugs-connected, url("/icons/plugs-connected.svg"));
}

.svg-plugs {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plugs, url("/icons/plugs.svg"));
          mask: var(--icon-url-plugs, url("/icons/plugs.svg"));
}

.svg-plus-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plus-circle, url("/icons/plus-circle.svg"));
          mask: var(--icon-url-plus-circle, url("/icons/plus-circle.svg"));
}

.svg-plus-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plus-minus, url("/icons/plus-minus.svg"));
          mask: var(--icon-url-plus-minus, url("/icons/plus-minus.svg"));
}

.svg-plus-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plus-square, url("/icons/plus-square.svg"));
          mask: var(--icon-url-plus-square, url("/icons/plus-square.svg"));
}

.svg-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-plus, url("/icons/plus.svg"));
          mask: var(--icon-url-plus, url("/icons/plus.svg"));
}

.svg-poker-chip {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-poker-chip, url("/icons/poker-chip.svg"));
          mask: var(--icon-url-poker-chip, url("/icons/poker-chip.svg"));
}

.svg-police-car {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-police-car, url("/icons/police-car.svg"));
          mask: var(--icon-url-police-car, url("/icons/police-car.svg"));
}

.svg-polygon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-polygon, url("/icons/polygon.svg"));
          mask: var(--icon-url-polygon, url("/icons/polygon.svg"));
}

.svg-popcorn {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-popcorn, url("/icons/popcorn.svg"));
          mask: var(--icon-url-popcorn, url("/icons/popcorn.svg"));
}

.svg-popsicle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-popsicle, url("/icons/popsicle.svg"));
          mask: var(--icon-url-popsicle, url("/icons/popsicle.svg"));
}

.svg-potted-plant {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-potted-plant, url("/icons/potted-plant.svg"));
          mask: var(--icon-url-potted-plant, url("/icons/potted-plant.svg"));
}

.svg-power {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-power, url("/icons/power.svg"));
          mask: var(--icon-url-power, url("/icons/power.svg"));
}

.svg-prescription {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-prescription, url("/icons/prescription.svg"));
          mask: var(--icon-url-prescription, url("/icons/prescription.svg"));
}

.svg-presentation-chart {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-presentation-chart, url("/icons/presentation-chart.svg"));
          mask: var(--icon-url-presentation-chart, url("/icons/presentation-chart.svg"));
}

.svg-presentation {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-presentation, url("/icons/presentation.svg"));
          mask: var(--icon-url-presentation, url("/icons/presentation.svg"));
}

.svg-printer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-printer, url("/icons/printer.svg"));
          mask: var(--icon-url-printer, url("/icons/printer.svg"));
}

.svg-prohibit-inset {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-prohibit-inset, url("/icons/prohibit-inset.svg"));
          mask: var(--icon-url-prohibit-inset, url("/icons/prohibit-inset.svg"));
}

.svg-prohibit {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-prohibit, url("/icons/prohibit.svg"));
          mask: var(--icon-url-prohibit, url("/icons/prohibit.svg"));
}

.svg-projector-screen-chart {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-projector-screen-chart, url("/icons/projector-screen-chart.svg"));
          mask: var(--icon-url-projector-screen-chart, url("/icons/projector-screen-chart.svg"));
}

.svg-projector-screen {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-projector-screen, url("/icons/projector-screen.svg"));
          mask: var(--icon-url-projector-screen, url("/icons/projector-screen.svg"));
}

.svg-pulse {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-pulse, url("/icons/pulse.svg"));
          mask: var(--icon-url-pulse, url("/icons/pulse.svg"));
}

.svg-push-pin-simple-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-push-pin-simple-slash, url("/icons/push-pin-simple-slash.svg"));
          mask: var(--icon-url-push-pin-simple-slash, url("/icons/push-pin-simple-slash.svg"));
}

.svg-push-pin-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-push-pin-simple, url("/icons/push-pin-simple.svg"));
          mask: var(--icon-url-push-pin-simple, url("/icons/push-pin-simple.svg"));
}

.svg-push-pin-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-push-pin-slash, url("/icons/push-pin-slash.svg"));
          mask: var(--icon-url-push-pin-slash, url("/icons/push-pin-slash.svg"));
}

.svg-push-pin {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-push-pin, url("/icons/push-pin.svg"));
          mask: var(--icon-url-push-pin, url("/icons/push-pin.svg"));
}

.svg-puzzle-piece {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-puzzle-piece, url("/icons/puzzle-piece.svg"));
          mask: var(--icon-url-puzzle-piece, url("/icons/puzzle-piece.svg"));
}

.svg-qr-code {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-qr-code, url("/icons/qr-code.svg"));
          mask: var(--icon-url-qr-code, url("/icons/qr-code.svg"));
}

.svg-question-mark {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-question-mark, url("/icons/question-mark.svg"));
          mask: var(--icon-url-question-mark, url("/icons/question-mark.svg"));
}

.svg-question {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-question, url("/icons/question.svg"));
          mask: var(--icon-url-question, url("/icons/question.svg"));
}

.svg-queue {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-queue, url("/icons/queue.svg"));
          mask: var(--icon-url-queue, url("/icons/queue.svg"));
}

.svg-quotes {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-quotes, url("/icons/quotes.svg"));
          mask: var(--icon-url-quotes, url("/icons/quotes.svg"));
}

.svg-rabbit {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rabbit, url("/icons/rabbit.svg"));
          mask: var(--icon-url-rabbit, url("/icons/rabbit.svg"));
}

.svg-racquet {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-racquet, url("/icons/racquet.svg"));
          mask: var(--icon-url-racquet, url("/icons/racquet.svg"));
}

.svg-radical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-radical, url("/icons/radical.svg"));
          mask: var(--icon-url-radical, url("/icons/radical.svg"));
}

.svg-radio-button {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-radio-button, url("/icons/radio-button.svg"));
          mask: var(--icon-url-radio-button, url("/icons/radio-button.svg"));
}

.svg-radio {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-radio, url("/icons/radio.svg"));
          mask: var(--icon-url-radio, url("/icons/radio.svg"));
}

.svg-radioactive {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-radioactive, url("/icons/radioactive.svg"));
          mask: var(--icon-url-radioactive, url("/icons/radioactive.svg"));
}

.svg-rainbow-cloud {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rainbow-cloud, url("/icons/rainbow-cloud.svg"));
          mask: var(--icon-url-rainbow-cloud, url("/icons/rainbow-cloud.svg"));
}

.svg-rainbow {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rainbow, url("/icons/rainbow.svg"));
          mask: var(--icon-url-rainbow, url("/icons/rainbow.svg"));
}

.svg-ranking {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ranking, url("/icons/ranking.svg"));
          mask: var(--icon-url-ranking, url("/icons/ranking.svg"));
}

.svg-read-cv-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-read-cv-logo, url("/icons/read-cv-logo.svg"));
          mask: var(--icon-url-read-cv-logo, url("/icons/read-cv-logo.svg"));
}

.svg-receipt-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-receipt-x, url("/icons/receipt-x.svg"));
          mask: var(--icon-url-receipt-x, url("/icons/receipt-x.svg"));
}

.svg-receipt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-receipt, url("/icons/receipt.svg"));
          mask: var(--icon-url-receipt, url("/icons/receipt.svg"));
}

.svg-record {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-record, url("/icons/record.svg"));
          mask: var(--icon-url-record, url("/icons/record.svg"));
}

.svg-rectangle-dashed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rectangle-dashed, url("/icons/rectangle-dashed.svg"));
          mask: var(--icon-url-rectangle-dashed, url("/icons/rectangle-dashed.svg"));
}

.svg-rectangle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rectangle, url("/icons/rectangle.svg"));
          mask: var(--icon-url-rectangle, url("/icons/rectangle.svg"));
}

.svg-recycle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-recycle, url("/icons/recycle.svg"));
          mask: var(--icon-url-recycle, url("/icons/recycle.svg"));
}

.svg-reddit-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-reddit-logo, url("/icons/reddit-logo.svg"));
          mask: var(--icon-url-reddit-logo, url("/icons/reddit-logo.svg"));
}

.svg-repeat-once {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-repeat-once, url("/icons/repeat-once.svg"));
          mask: var(--icon-url-repeat-once, url("/icons/repeat-once.svg"));
}

.svg-repeat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-repeat, url("/icons/repeat.svg"));
          mask: var(--icon-url-repeat, url("/icons/repeat.svg"));
}

.svg-replit-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-replit-logo, url("/icons/replit-logo.svg"));
          mask: var(--icon-url-replit-logo, url("/icons/replit-logo.svg"));
}

.svg-resize {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-resize, url("/icons/resize.svg"));
          mask: var(--icon-url-resize, url("/icons/resize.svg"));
}

.svg-rewind-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rewind-circle, url("/icons/rewind-circle.svg"));
          mask: var(--icon-url-rewind-circle, url("/icons/rewind-circle.svg"));
}

.svg-rewind {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rewind, url("/icons/rewind.svg"));
          mask: var(--icon-url-rewind, url("/icons/rewind.svg"));
}

.svg-road-horizon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-road-horizon, url("/icons/road-horizon.svg"));
          mask: var(--icon-url-road-horizon, url("/icons/road-horizon.svg"));
}

.svg-robot {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-robot, url("/icons/robot.svg"));
          mask: var(--icon-url-robot, url("/icons/robot.svg"));
}

.svg-rocket-launch {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rocket-launch, url("/icons/rocket-launch.svg"));
          mask: var(--icon-url-rocket-launch, url("/icons/rocket-launch.svg"));
}

.svg-rocket {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rocket, url("/icons/rocket.svg"));
          mask: var(--icon-url-rocket, url("/icons/rocket.svg"));
}

.svg-rows-plus-bottom {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rows-plus-bottom, url("/icons/rows-plus-bottom.svg"));
          mask: var(--icon-url-rows-plus-bottom, url("/icons/rows-plus-bottom.svg"));
}

.svg-rows-plus-top {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rows-plus-top, url("/icons/rows-plus-top.svg"));
          mask: var(--icon-url-rows-plus-top, url("/icons/rows-plus-top.svg"));
}

.svg-rows {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rows, url("/icons/rows.svg"));
          mask: var(--icon-url-rows, url("/icons/rows.svg"));
}

.svg-rss-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rss-simple, url("/icons/rss-simple.svg"));
          mask: var(--icon-url-rss-simple, url("/icons/rss-simple.svg"));
}

.svg-rss {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rss, url("/icons/rss.svg"));
          mask: var(--icon-url-rss, url("/icons/rss.svg"));
}

.svg-rug {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-rug, url("/icons/rug.svg"));
          mask: var(--icon-url-rug, url("/icons/rug.svg"));
}

.svg-ruler {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ruler, url("/icons/ruler.svg"));
          mask: var(--icon-url-ruler, url("/icons/ruler.svg"));
}

.svg-sailboat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sailboat, url("/icons/sailboat.svg"));
          mask: var(--icon-url-sailboat, url("/icons/sailboat.svg"));
}

.svg-scales {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-scales, url("/icons/scales.svg"));
          mask: var(--icon-url-scales, url("/icons/scales.svg"));
}

.svg-scan-smiley {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-scan-smiley, url("/icons/scan-smiley.svg"));
          mask: var(--icon-url-scan-smiley, url("/icons/scan-smiley.svg"));
}

.svg-scan {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-scan, url("/icons/scan.svg"));
          mask: var(--icon-url-scan, url("/icons/scan.svg"));
}

.svg-scissors {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-scissors, url("/icons/scissors.svg"));
          mask: var(--icon-url-scissors, url("/icons/scissors.svg"));
}

.svg-scooter {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-scooter, url("/icons/scooter.svg"));
          mask: var(--icon-url-scooter, url("/icons/scooter.svg"));
}

.svg-screencast {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-screencast, url("/icons/screencast.svg"));
          mask: var(--icon-url-screencast, url("/icons/screencast.svg"));
}

.svg-screwdriver {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-screwdriver, url("/icons/screwdriver.svg"));
          mask: var(--icon-url-screwdriver, url("/icons/screwdriver.svg"));
}

.svg-scribble-loop {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-scribble-loop, url("/icons/scribble-loop.svg"));
          mask: var(--icon-url-scribble-loop, url("/icons/scribble-loop.svg"));
}

.svg-scribble {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-scribble, url("/icons/scribble.svg"));
          mask: var(--icon-url-scribble, url("/icons/scribble.svg"));
}

.svg-scroll {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-scroll, url("/icons/scroll.svg"));
          mask: var(--icon-url-scroll, url("/icons/scroll.svg"));
}

.svg-seal-check {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-seal-check, url("/icons/seal-check.svg"));
          mask: var(--icon-url-seal-check, url("/icons/seal-check.svg"));
}

.svg-seal-percent {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-seal-percent, url("/icons/seal-percent.svg"));
          mask: var(--icon-url-seal-percent, url("/icons/seal-percent.svg"));
}

.svg-seal-question {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-seal-question, url("/icons/seal-question.svg"));
          mask: var(--icon-url-seal-question, url("/icons/seal-question.svg"));
}

.svg-seal-warning {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-seal-warning, url("/icons/seal-warning.svg"));
          mask: var(--icon-url-seal-warning, url("/icons/seal-warning.svg"));
}

.svg-seal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-seal, url("/icons/seal.svg"));
          mask: var(--icon-url-seal, url("/icons/seal.svg"));
}

.svg-seat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-seat, url("/icons/seat.svg"));
          mask: var(--icon-url-seat, url("/icons/seat.svg"));
}

.svg-seatbelt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-seatbelt, url("/icons/seatbelt.svg"));
          mask: var(--icon-url-seatbelt, url("/icons/seatbelt.svg"));
}

.svg-security-camera {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-security-camera, url("/icons/security-camera.svg"));
          mask: var(--icon-url-security-camera, url("/icons/security-camera.svg"));
}

.svg-selection-all {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-selection-all, url("/icons/selection-all.svg"));
          mask: var(--icon-url-selection-all, url("/icons/selection-all.svg"));
}

.svg-selection-background {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-selection-background, url("/icons/selection-background.svg"));
          mask: var(--icon-url-selection-background, url("/icons/selection-background.svg"));
}

.svg-selection-foreground {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-selection-foreground, url("/icons/selection-foreground.svg"));
          mask: var(--icon-url-selection-foreground, url("/icons/selection-foreground.svg"));
}

.svg-selection-inverse {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-selection-inverse, url("/icons/selection-inverse.svg"));
          mask: var(--icon-url-selection-inverse, url("/icons/selection-inverse.svg"));
}

.svg-selection-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-selection-plus, url("/icons/selection-plus.svg"));
          mask: var(--icon-url-selection-plus, url("/icons/selection-plus.svg"));
}

.svg-selection-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-selection-slash, url("/icons/selection-slash.svg"));
          mask: var(--icon-url-selection-slash, url("/icons/selection-slash.svg"));
}

.svg-selection {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-selection, url("/icons/selection.svg"));
          mask: var(--icon-url-selection, url("/icons/selection.svg"));
}

.svg-shapes {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shapes, url("/icons/shapes.svg"));
          mask: var(--icon-url-shapes, url("/icons/shapes.svg"));
}

.svg-share-fat {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-share-fat, url("/icons/share-fat.svg"));
          mask: var(--icon-url-share-fat, url("/icons/share-fat.svg"));
}

.svg-share-network {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-share-network, url("/icons/share-network.svg"));
          mask: var(--icon-url-share-network, url("/icons/share-network.svg"));
}

.svg-share {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-share, url("/icons/share.svg"));
          mask: var(--icon-url-share, url("/icons/share.svg"));
}

.svg-shield-check {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shield-check, url("/icons/shield-check.svg"));
          mask: var(--icon-url-shield-check, url("/icons/shield-check.svg"));
}

.svg-shield-checkered {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shield-checkered, url("/icons/shield-checkered.svg"));
          mask: var(--icon-url-shield-checkered, url("/icons/shield-checkered.svg"));
}

.svg-shield-chevron {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shield-chevron, url("/icons/shield-chevron.svg"));
          mask: var(--icon-url-shield-chevron, url("/icons/shield-chevron.svg"));
}

.svg-shield-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shield-plus, url("/icons/shield-plus.svg"));
          mask: var(--icon-url-shield-plus, url("/icons/shield-plus.svg"));
}

.svg-shield-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shield-slash, url("/icons/shield-slash.svg"));
          mask: var(--icon-url-shield-slash, url("/icons/shield-slash.svg"));
}

.svg-shield-star {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shield-star, url("/icons/shield-star.svg"));
          mask: var(--icon-url-shield-star, url("/icons/shield-star.svg"));
}

.svg-shield-warning {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shield-warning, url("/icons/shield-warning.svg"));
          mask: var(--icon-url-shield-warning, url("/icons/shield-warning.svg"));
}

.svg-shield {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shield, url("/icons/shield.svg"));
          mask: var(--icon-url-shield, url("/icons/shield.svg"));
}

.svg-shipping-container {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shipping-container, url("/icons/shipping-container.svg"));
          mask: var(--icon-url-shipping-container, url("/icons/shipping-container.svg"));
}

.svg-shirt-folded {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shirt-folded, url("/icons/shirt-folded.svg"));
          mask: var(--icon-url-shirt-folded, url("/icons/shirt-folded.svg"));
}

.svg-shooting-star {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shooting-star, url("/icons/shooting-star.svg"));
          mask: var(--icon-url-shooting-star, url("/icons/shooting-star.svg"));
}

.svg-shopping-bag-open {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shopping-bag-open, url("/icons/shopping-bag-open.svg"));
          mask: var(--icon-url-shopping-bag-open, url("/icons/shopping-bag-open.svg"));
}

.svg-shopping-bag {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shopping-bag, url("/icons/shopping-bag.svg"));
          mask: var(--icon-url-shopping-bag, url("/icons/shopping-bag.svg"));
}

.svg-shopping-cart-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shopping-cart-simple, url("/icons/shopping-cart-simple.svg"));
          mask: var(--icon-url-shopping-cart-simple, url("/icons/shopping-cart-simple.svg"));
}

.svg-shopping-cart {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shopping-cart, url("/icons/shopping-cart.svg"));
          mask: var(--icon-url-shopping-cart, url("/icons/shopping-cart.svg"));
}

.svg-shovel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shovel, url("/icons/shovel.svg"));
          mask: var(--icon-url-shovel, url("/icons/shovel.svg"));
}

.svg-shower {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shower, url("/icons/shower.svg"));
          mask: var(--icon-url-shower, url("/icons/shower.svg"));
}

.svg-shrimp {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shrimp, url("/icons/shrimp.svg"));
          mask: var(--icon-url-shrimp, url("/icons/shrimp.svg"));
}

.svg-shuffle-angular {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shuffle-angular, url("/icons/shuffle-angular.svg"));
          mask: var(--icon-url-shuffle-angular, url("/icons/shuffle-angular.svg"));
}

.svg-shuffle-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shuffle-simple, url("/icons/shuffle-simple.svg"));
          mask: var(--icon-url-shuffle-simple, url("/icons/shuffle-simple.svg"));
}

.svg-shuffle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-shuffle, url("/icons/shuffle.svg"));
          mask: var(--icon-url-shuffle, url("/icons/shuffle.svg"));
}

.svg-sidebar-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sidebar-simple, url("/icons/sidebar-simple.svg"));
          mask: var(--icon-url-sidebar-simple, url("/icons/sidebar-simple.svg"));
}

.svg-sidebar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sidebar, url("/icons/sidebar.svg"));
          mask: var(--icon-url-sidebar, url("/icons/sidebar.svg"));
}

.svg-sigma {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sigma, url("/icons/sigma.svg"));
          mask: var(--icon-url-sigma, url("/icons/sigma.svg"));
}

.svg-sign-in {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sign-in, url("/icons/sign-in.svg"));
          mask: var(--icon-url-sign-in, url("/icons/sign-in.svg"));
}

.svg-sign-out {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sign-out, url("/icons/sign-out.svg"));
          mask: var(--icon-url-sign-out, url("/icons/sign-out.svg"));
}

.svg-signature {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-signature, url("/icons/signature.svg"));
          mask: var(--icon-url-signature, url("/icons/signature.svg"));
}

.svg-signpost {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-signpost, url("/icons/signpost.svg"));
          mask: var(--icon-url-signpost, url("/icons/signpost.svg"));
}

.svg-sim-card {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sim-card, url("/icons/sim-card.svg"));
          mask: var(--icon-url-sim-card, url("/icons/sim-card.svg"));
}

.svg-siren {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-siren, url("/icons/siren.svg"));
          mask: var(--icon-url-siren, url("/icons/siren.svg"));
}

.svg-sketch-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sketch-logo, url("/icons/sketch-logo.svg"));
          mask: var(--icon-url-sketch-logo, url("/icons/sketch-logo.svg"));
}

.svg-skip-back-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-skip-back-circle, url("/icons/skip-back-circle.svg"));
          mask: var(--icon-url-skip-back-circle, url("/icons/skip-back-circle.svg"));
}

.svg-skip-back {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-skip-back, url("/icons/skip-back.svg"));
          mask: var(--icon-url-skip-back, url("/icons/skip-back.svg"));
}

.svg-skip-forward-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-skip-forward-circle, url("/icons/skip-forward-circle.svg"));
          mask: var(--icon-url-skip-forward-circle, url("/icons/skip-forward-circle.svg"));
}

.svg-skip-forward {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-skip-forward, url("/icons/skip-forward.svg"));
          mask: var(--icon-url-skip-forward, url("/icons/skip-forward.svg"));
}

.svg-skull {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-skull, url("/icons/skull.svg"));
          mask: var(--icon-url-skull, url("/icons/skull.svg"));
}

.svg-skype-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-skype-logo, url("/icons/skype-logo.svg"));
          mask: var(--icon-url-skype-logo, url("/icons/skype-logo.svg"));
}

.svg-slack-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-slack-logo, url("/icons/slack-logo.svg"));
          mask: var(--icon-url-slack-logo, url("/icons/slack-logo.svg"));
}

.svg-sliders-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sliders-horizontal, url("/icons/sliders-horizontal.svg"));
          mask: var(--icon-url-sliders-horizontal, url("/icons/sliders-horizontal.svg"));
}

.svg-sliders {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sliders, url("/icons/sliders.svg"));
          mask: var(--icon-url-sliders, url("/icons/sliders.svg"));
}

.svg-slideshow {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-slideshow, url("/icons/slideshow.svg"));
          mask: var(--icon-url-slideshow, url("/icons/slideshow.svg"));
}

.svg-smiley-angry {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-angry, url("/icons/smiley-angry.svg"));
          mask: var(--icon-url-smiley-angry, url("/icons/smiley-angry.svg"));
}

.svg-smiley-blank {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-blank, url("/icons/smiley-blank.svg"));
          mask: var(--icon-url-smiley-blank, url("/icons/smiley-blank.svg"));
}

.svg-smiley-meh {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-meh, url("/icons/smiley-meh.svg"));
          mask: var(--icon-url-smiley-meh, url("/icons/smiley-meh.svg"));
}

.svg-smiley-melting {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-melting, url("/icons/smiley-melting.svg"));
          mask: var(--icon-url-smiley-melting, url("/icons/smiley-melting.svg"));
}

.svg-smiley-nervous {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-nervous, url("/icons/smiley-nervous.svg"));
          mask: var(--icon-url-smiley-nervous, url("/icons/smiley-nervous.svg"));
}

.svg-smiley-sad {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-sad, url("/icons/smiley-sad.svg"));
          mask: var(--icon-url-smiley-sad, url("/icons/smiley-sad.svg"));
}

.svg-smiley-sticker {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-sticker, url("/icons/smiley-sticker.svg"));
          mask: var(--icon-url-smiley-sticker, url("/icons/smiley-sticker.svg"));
}

.svg-smiley-wink {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-wink, url("/icons/smiley-wink.svg"));
          mask: var(--icon-url-smiley-wink, url("/icons/smiley-wink.svg"));
}

.svg-smiley-x-eyes {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley-x-eyes, url("/icons/smiley-x-eyes.svg"));
          mask: var(--icon-url-smiley-x-eyes, url("/icons/smiley-x-eyes.svg"));
}

.svg-smiley {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-smiley, url("/icons/smiley.svg"));
          mask: var(--icon-url-smiley, url("/icons/smiley.svg"));
}

.svg-snapchat-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-snapchat-logo, url("/icons/snapchat-logo.svg"));
          mask: var(--icon-url-snapchat-logo, url("/icons/snapchat-logo.svg"));
}

.svg-sneaker-move {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sneaker-move, url("/icons/sneaker-move.svg"));
          mask: var(--icon-url-sneaker-move, url("/icons/sneaker-move.svg"));
}

.svg-sneaker {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sneaker, url("/icons/sneaker.svg"));
          mask: var(--icon-url-sneaker, url("/icons/sneaker.svg"));
}

.svg-snowflake {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-snowflake, url("/icons/snowflake.svg"));
          mask: var(--icon-url-snowflake, url("/icons/snowflake.svg"));
}

.svg-soccer-ball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-soccer-ball, url("/icons/soccer-ball.svg"));
          mask: var(--icon-url-soccer-ball, url("/icons/soccer-ball.svg"));
}

.svg-sock {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sock, url("/icons/sock.svg"));
          mask: var(--icon-url-sock, url("/icons/sock.svg"));
}

.svg-solar-panel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-solar-panel, url("/icons/solar-panel.svg"));
          mask: var(--icon-url-solar-panel, url("/icons/solar-panel.svg"));
}

.svg-solar-roof {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-solar-roof, url("/icons/solar-roof.svg"));
          mask: var(--icon-url-solar-roof, url("/icons/solar-roof.svg"));
}

.svg-sort-ascending {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sort-ascending, url("/icons/sort-ascending.svg"));
          mask: var(--icon-url-sort-ascending, url("/icons/sort-ascending.svg"));
}

.svg-sort-descending {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sort-descending, url("/icons/sort-descending.svg"));
          mask: var(--icon-url-sort-descending, url("/icons/sort-descending.svg"));
}

.svg-soundcloud-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-soundcloud-logo, url("/icons/soundcloud-logo.svg"));
          mask: var(--icon-url-soundcloud-logo, url("/icons/soundcloud-logo.svg"));
}

.svg-spade {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-spade, url("/icons/spade.svg"));
          mask: var(--icon-url-spade, url("/icons/spade.svg"));
}

.svg-sparkle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sparkle, url("/icons/sparkle.svg"));
          mask: var(--icon-url-sparkle, url("/icons/sparkle.svg"));
}

.svg-speaker-hifi {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-hifi, url("/icons/speaker-hifi.svg"));
          mask: var(--icon-url-speaker-hifi, url("/icons/speaker-hifi.svg"));
}

.svg-speaker-high {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-high, url("/icons/speaker-high.svg"));
          mask: var(--icon-url-speaker-high, url("/icons/speaker-high.svg"));
}

.svg-speaker-low {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-low, url("/icons/speaker-low.svg"));
          mask: var(--icon-url-speaker-low, url("/icons/speaker-low.svg"));
}

.svg-speaker-none {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-none, url("/icons/speaker-none.svg"));
          mask: var(--icon-url-speaker-none, url("/icons/speaker-none.svg"));
}

.svg-speaker-simple-high {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-simple-high, url("/icons/speaker-simple-high.svg"));
          mask: var(--icon-url-speaker-simple-high, url("/icons/speaker-simple-high.svg"));
}

.svg-speaker-simple-low {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-simple-low, url("/icons/speaker-simple-low.svg"));
          mask: var(--icon-url-speaker-simple-low, url("/icons/speaker-simple-low.svg"));
}

.svg-speaker-simple-none {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-simple-none, url("/icons/speaker-simple-none.svg"));
          mask: var(--icon-url-speaker-simple-none, url("/icons/speaker-simple-none.svg"));
}

.svg-speaker-simple-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-simple-slash, url("/icons/speaker-simple-slash.svg"));
          mask: var(--icon-url-speaker-simple-slash, url("/icons/speaker-simple-slash.svg"));
}

.svg-speaker-simple-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-simple-x, url("/icons/speaker-simple-x.svg"));
          mask: var(--icon-url-speaker-simple-x, url("/icons/speaker-simple-x.svg"));
}

.svg-speaker-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-slash, url("/icons/speaker-slash.svg"));
          mask: var(--icon-url-speaker-slash, url("/icons/speaker-slash.svg"));
}

.svg-speaker-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speaker-x, url("/icons/speaker-x.svg"));
          mask: var(--icon-url-speaker-x, url("/icons/speaker-x.svg"));
}

.svg-speedometer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-speedometer, url("/icons/speedometer.svg"));
          mask: var(--icon-url-speedometer, url("/icons/speedometer.svg"));
}

.svg-sphere {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sphere, url("/icons/sphere.svg"));
          mask: var(--icon-url-sphere, url("/icons/sphere.svg"));
}

.svg-spinner-ball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-spinner-ball, url("/icons/spinner-ball.svg"));
          mask: var(--icon-url-spinner-ball, url("/icons/spinner-ball.svg"));
}

.svg-spinner-gap {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-spinner-gap, url("/icons/spinner-gap.svg"));
          mask: var(--icon-url-spinner-gap, url("/icons/spinner-gap.svg"));
}

.svg-spinner {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-spinner, url("/icons/spinner.svg"));
          mask: var(--icon-url-spinner, url("/icons/spinner.svg"));
}

.svg-spiral {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-spiral, url("/icons/spiral.svg"));
          mask: var(--icon-url-spiral, url("/icons/spiral.svg"));
}

.svg-split-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-split-horizontal, url("/icons/split-horizontal.svg"));
          mask: var(--icon-url-split-horizontal, url("/icons/split-horizontal.svg"));
}

.svg-split-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-split-vertical, url("/icons/split-vertical.svg"));
          mask: var(--icon-url-split-vertical, url("/icons/split-vertical.svg"));
}

.svg-spotify-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-spotify-logo, url("/icons/spotify-logo.svg"));
          mask: var(--icon-url-spotify-logo, url("/icons/spotify-logo.svg"));
}

.svg-spray-bottle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-spray-bottle, url("/icons/spray-bottle.svg"));
          mask: var(--icon-url-spray-bottle, url("/icons/spray-bottle.svg"));
}

.svg-square-half-bottom {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-square-half-bottom, url("/icons/square-half-bottom.svg"));
          mask: var(--icon-url-square-half-bottom, url("/icons/square-half-bottom.svg"));
}

.svg-square-half {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-square-half, url("/icons/square-half.svg"));
          mask: var(--icon-url-square-half, url("/icons/square-half.svg"));
}

.svg-square-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-square-logo, url("/icons/square-logo.svg"));
          mask: var(--icon-url-square-logo, url("/icons/square-logo.svg"));
}

.svg-square-split-horizontal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-square-split-horizontal, url("/icons/square-split-horizontal.svg"));
          mask: var(--icon-url-square-split-horizontal, url("/icons/square-split-horizontal.svg"));
}

.svg-square-split-vertical {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-square-split-vertical, url("/icons/square-split-vertical.svg"));
          mask: var(--icon-url-square-split-vertical, url("/icons/square-split-vertical.svg"));
}

.svg-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-square, url("/icons/square.svg"));
          mask: var(--icon-url-square, url("/icons/square.svg"));
}

.svg-squares-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-squares-four, url("/icons/squares-four.svg"));
          mask: var(--icon-url-squares-four, url("/icons/squares-four.svg"));
}

.svg-stack-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stack-minus, url("/icons/stack-minus.svg"));
          mask: var(--icon-url-stack-minus, url("/icons/stack-minus.svg"));
}

.svg-stack-overflow-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stack-overflow-logo, url("/icons/stack-overflow-logo.svg"));
          mask: var(--icon-url-stack-overflow-logo, url("/icons/stack-overflow-logo.svg"));
}

.svg-stack-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stack-plus, url("/icons/stack-plus.svg"));
          mask: var(--icon-url-stack-plus, url("/icons/stack-plus.svg"));
}

.svg-stack-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stack-simple, url("/icons/stack-simple.svg"));
          mask: var(--icon-url-stack-simple, url("/icons/stack-simple.svg"));
}

.svg-stack {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stack, url("/icons/stack.svg"));
          mask: var(--icon-url-stack, url("/icons/stack.svg"));
}

.svg-stairs {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stairs, url("/icons/stairs.svg"));
          mask: var(--icon-url-stairs, url("/icons/stairs.svg"));
}

.svg-stamp {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stamp, url("/icons/stamp.svg"));
          mask: var(--icon-url-stamp, url("/icons/stamp.svg"));
}

.svg-standard-definition {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-standard-definition, url("/icons/standard-definition.svg"));
          mask: var(--icon-url-standard-definition, url("/icons/standard-definition.svg"));
}

.svg-star-and-crescent {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-star-and-crescent, url("/icons/star-and-crescent.svg"));
          mask: var(--icon-url-star-and-crescent, url("/icons/star-and-crescent.svg"));
}

.svg-star-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-star-four, url("/icons/star-four.svg"));
          mask: var(--icon-url-star-four, url("/icons/star-four.svg"));
}

.svg-star-half {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-star-half, url("/icons/star-half.svg"));
          mask: var(--icon-url-star-half, url("/icons/star-half.svg"));
}

.svg-star-of-david {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-star-of-david, url("/icons/star-of-david.svg"));
          mask: var(--icon-url-star-of-david, url("/icons/star-of-david.svg"));
}

.svg-star {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-star, url("/icons/star.svg"));
          mask: var(--icon-url-star, url("/icons/star.svg"));
}

.svg-steam-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-steam-logo, url("/icons/steam-logo.svg"));
          mask: var(--icon-url-steam-logo, url("/icons/steam-logo.svg"));
}

.svg-steering-wheel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-steering-wheel, url("/icons/steering-wheel.svg"));
          mask: var(--icon-url-steering-wheel, url("/icons/steering-wheel.svg"));
}

.svg-steps {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-steps, url("/icons/steps.svg"));
          mask: var(--icon-url-steps, url("/icons/steps.svg"));
}

.svg-stethoscope {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stethoscope, url("/icons/stethoscope.svg"));
          mask: var(--icon-url-stethoscope, url("/icons/stethoscope.svg"));
}

.svg-sticker {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sticker, url("/icons/sticker.svg"));
          mask: var(--icon-url-sticker, url("/icons/sticker.svg"));
}

.svg-stool {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stool, url("/icons/stool.svg"));
          mask: var(--icon-url-stool, url("/icons/stool.svg"));
}

.svg-stop-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stop-circle, url("/icons/stop-circle.svg"));
          mask: var(--icon-url-stop-circle, url("/icons/stop-circle.svg"));
}

.svg-stop {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stop, url("/icons/stop.svg"));
          mask: var(--icon-url-stop, url("/icons/stop.svg"));
}

.svg-storefront {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-storefront, url("/icons/storefront.svg"));
          mask: var(--icon-url-storefront, url("/icons/storefront.svg"));
}

.svg-strategy {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-strategy, url("/icons/strategy.svg"));
          mask: var(--icon-url-strategy, url("/icons/strategy.svg"));
}

.svg-stripe-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-stripe-logo, url("/icons/stripe-logo.svg"));
          mask: var(--icon-url-stripe-logo, url("/icons/stripe-logo.svg"));
}

.svg-student {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-student, url("/icons/student.svg"));
          mask: var(--icon-url-student, url("/icons/student.svg"));
}

.svg-subset-of {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-subset-of, url("/icons/subset-of.svg"));
          mask: var(--icon-url-subset-of, url("/icons/subset-of.svg"));
}

.svg-subset-proper-of {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-subset-proper-of, url("/icons/subset-proper-of.svg"));
          mask: var(--icon-url-subset-proper-of, url("/icons/subset-proper-of.svg"));
}

.svg-subtitles-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-subtitles-slash, url("/icons/subtitles-slash.svg"));
          mask: var(--icon-url-subtitles-slash, url("/icons/subtitles-slash.svg"));
}

.svg-subtitles {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-subtitles, url("/icons/subtitles.svg"));
          mask: var(--icon-url-subtitles, url("/icons/subtitles.svg"));
}

.svg-subtract-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-subtract-square, url("/icons/subtract-square.svg"));
          mask: var(--icon-url-subtract-square, url("/icons/subtract-square.svg"));
}

.svg-subtract {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-subtract, url("/icons/subtract.svg"));
          mask: var(--icon-url-subtract, url("/icons/subtract.svg"));
}

.svg-subway {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-subway, url("/icons/subway.svg"));
          mask: var(--icon-url-subway, url("/icons/subway.svg"));
}

.svg-suitcase-rolling {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-suitcase-rolling, url("/icons/suitcase-rolling.svg"));
          mask: var(--icon-url-suitcase-rolling, url("/icons/suitcase-rolling.svg"));
}

.svg-suitcase-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-suitcase-simple, url("/icons/suitcase-simple.svg"));
          mask: var(--icon-url-suitcase-simple, url("/icons/suitcase-simple.svg"));
}

.svg-suitcase {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-suitcase, url("/icons/suitcase.svg"));
          mask: var(--icon-url-suitcase, url("/icons/suitcase.svg"));
}

.svg-sun-dim {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sun-dim, url("/icons/sun-dim.svg"));
          mask: var(--icon-url-sun-dim, url("/icons/sun-dim.svg"));
}

.svg-sun-horizon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sun-horizon, url("/icons/sun-horizon.svg"));
          mask: var(--icon-url-sun-horizon, url("/icons/sun-horizon.svg"));
}

.svg-sun {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sun, url("/icons/sun.svg"));
          mask: var(--icon-url-sun, url("/icons/sun.svg"));
}

.svg-sunglasses {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sunglasses, url("/icons/sunglasses.svg"));
          mask: var(--icon-url-sunglasses, url("/icons/sunglasses.svg"));
}

.svg-superset-of {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-superset-of, url("/icons/superset-of.svg"));
          mask: var(--icon-url-superset-of, url("/icons/superset-of.svg"));
}

.svg-superset-proper-of {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-superset-proper-of, url("/icons/superset-proper-of.svg"));
          mask: var(--icon-url-superset-proper-of, url("/icons/superset-proper-of.svg"));
}

.svg-swap {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-swap, url("/icons/swap.svg"));
          mask: var(--icon-url-swap, url("/icons/swap.svg"));
}

.svg-swatches {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-swatches, url("/icons/swatches.svg"));
          mask: var(--icon-url-swatches, url("/icons/swatches.svg"));
}

.svg-swimming-pool {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-swimming-pool, url("/icons/swimming-pool.svg"));
          mask: var(--icon-url-swimming-pool, url("/icons/swimming-pool.svg"));
}

.svg-sword {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-sword, url("/icons/sword.svg"));
          mask: var(--icon-url-sword, url("/icons/sword.svg"));
}

.svg-synagogue {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-synagogue, url("/icons/synagogue.svg"));
          mask: var(--icon-url-synagogue, url("/icons/synagogue.svg"));
}

.svg-syringe {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-syringe, url("/icons/syringe.svg"));
          mask: var(--icon-url-syringe, url("/icons/syringe.svg"));
}

.svg-t-shirt {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-t-shirt, url("/icons/t-shirt.svg"));
          mask: var(--icon-url-t-shirt, url("/icons/t-shirt.svg"));
}

.svg-table {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-table, url("/icons/table.svg"));
          mask: var(--icon-url-table, url("/icons/table.svg"));
}

.svg-tabs {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tabs, url("/icons/tabs.svg"));
          mask: var(--icon-url-tabs, url("/icons/tabs.svg"));
}

.svg-tag-chevron {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tag-chevron, url("/icons/tag-chevron.svg"));
          mask: var(--icon-url-tag-chevron, url("/icons/tag-chevron.svg"));
}

.svg-tag-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tag-simple, url("/icons/tag-simple.svg"));
          mask: var(--icon-url-tag-simple, url("/icons/tag-simple.svg"));
}

.svg-tag {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tag, url("/icons/tag.svg"));
          mask: var(--icon-url-tag, url("/icons/tag.svg"));
}

.svg-target {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-target, url("/icons/target.svg"));
          mask: var(--icon-url-target, url("/icons/target.svg"));
}

.svg-taxi {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-taxi, url("/icons/taxi.svg"));
          mask: var(--icon-url-taxi, url("/icons/taxi.svg"));
}

.svg-tea-bag {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tea-bag, url("/icons/tea-bag.svg"));
          mask: var(--icon-url-tea-bag, url("/icons/tea-bag.svg"));
}

.svg-telegram-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-telegram-logo, url("/icons/telegram-logo.svg"));
          mask: var(--icon-url-telegram-logo, url("/icons/telegram-logo.svg"));
}

.svg-television-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-television-simple, url("/icons/television-simple.svg"));
          mask: var(--icon-url-television-simple, url("/icons/television-simple.svg"));
}

.svg-television {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-television, url("/icons/television.svg"));
          mask: var(--icon-url-television, url("/icons/television.svg"));
}

.svg-tennis-ball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tennis-ball, url("/icons/tennis-ball.svg"));
          mask: var(--icon-url-tennis-ball, url("/icons/tennis-ball.svg"));
}

.svg-tent {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tent, url("/icons/tent.svg"));
          mask: var(--icon-url-tent, url("/icons/tent.svg"));
}

.svg-terminal-window {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-terminal-window, url("/icons/terminal-window.svg"));
          mask: var(--icon-url-terminal-window, url("/icons/terminal-window.svg"));
}

.svg-terminal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-terminal, url("/icons/terminal.svg"));
          mask: var(--icon-url-terminal, url("/icons/terminal.svg"));
}

.svg-test-tube {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-test-tube, url("/icons/test-tube.svg"));
          mask: var(--icon-url-test-tube, url("/icons/test-tube.svg"));
}

.svg-text-a-underline {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-a-underline, url("/icons/text-a-underline.svg"));
          mask: var(--icon-url-text-a-underline, url("/icons/text-a-underline.svg"));
}

.svg-text-aa {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-aa, url("/icons/text-aa.svg"));
          mask: var(--icon-url-text-aa, url("/icons/text-aa.svg"));
}

.svg-text-align-center {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-align-center, url("/icons/text-align-center.svg"));
          mask: var(--icon-url-text-align-center, url("/icons/text-align-center.svg"));
}

.svg-text-align-justify {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-align-justify, url("/icons/text-align-justify.svg"));
          mask: var(--icon-url-text-align-justify, url("/icons/text-align-justify.svg"));
}

.svg-text-align-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-align-left, url("/icons/text-align-left.svg"));
          mask: var(--icon-url-text-align-left, url("/icons/text-align-left.svg"));
}

.svg-text-align-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-align-right, url("/icons/text-align-right.svg"));
          mask: var(--icon-url-text-align-right, url("/icons/text-align-right.svg"));
}

.svg-text-b {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-b, url("/icons/text-b.svg"));
          mask: var(--icon-url-text-b, url("/icons/text-b.svg"));
}

.svg-text-columns {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-columns, url("/icons/text-columns.svg"));
          mask: var(--icon-url-text-columns, url("/icons/text-columns.svg"));
}

.svg-text-h-five {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-h-five, url("/icons/text-h-five.svg"));
          mask: var(--icon-url-text-h-five, url("/icons/text-h-five.svg"));
}

.svg-text-h-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-h-four, url("/icons/text-h-four.svg"));
          mask: var(--icon-url-text-h-four, url("/icons/text-h-four.svg"));
}

.svg-text-h-one {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-h-one, url("/icons/text-h-one.svg"));
          mask: var(--icon-url-text-h-one, url("/icons/text-h-one.svg"));
}

.svg-text-h-six {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-h-six, url("/icons/text-h-six.svg"));
          mask: var(--icon-url-text-h-six, url("/icons/text-h-six.svg"));
}

.svg-text-h-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-h-three, url("/icons/text-h-three.svg"));
          mask: var(--icon-url-text-h-three, url("/icons/text-h-three.svg"));
}

.svg-text-h-two {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-h-two, url("/icons/text-h-two.svg"));
          mask: var(--icon-url-text-h-two, url("/icons/text-h-two.svg"));
}

.svg-text-h {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-h, url("/icons/text-h.svg"));
          mask: var(--icon-url-text-h, url("/icons/text-h.svg"));
}

.svg-text-indent {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-indent, url("/icons/text-indent.svg"));
          mask: var(--icon-url-text-indent, url("/icons/text-indent.svg"));
}

.svg-text-italic {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-italic, url("/icons/text-italic.svg"));
          mask: var(--icon-url-text-italic, url("/icons/text-italic.svg"));
}

.svg-text-outdent {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-outdent, url("/icons/text-outdent.svg"));
          mask: var(--icon-url-text-outdent, url("/icons/text-outdent.svg"));
}

.svg-text-strikethrough {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-strikethrough, url("/icons/text-strikethrough.svg"));
          mask: var(--icon-url-text-strikethrough, url("/icons/text-strikethrough.svg"));
}

.svg-text-subscript {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-subscript, url("/icons/text-subscript.svg"));
          mask: var(--icon-url-text-subscript, url("/icons/text-subscript.svg"));
}

.svg-text-superscript {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-superscript, url("/icons/text-superscript.svg"));
          mask: var(--icon-url-text-superscript, url("/icons/text-superscript.svg"));
}

.svg-text-t-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-t-slash, url("/icons/text-t-slash.svg"));
          mask: var(--icon-url-text-t-slash, url("/icons/text-t-slash.svg"));
}

.svg-text-t {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-t, url("/icons/text-t.svg"));
          mask: var(--icon-url-text-t, url("/icons/text-t.svg"));
}

.svg-text-underline {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-text-underline, url("/icons/text-underline.svg"));
          mask: var(--icon-url-text-underline, url("/icons/text-underline.svg"));
}

.svg-textbox {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-textbox, url("/icons/textbox.svg"));
          mask: var(--icon-url-textbox, url("/icons/textbox.svg"));
}

.svg-thermometer-cold {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-thermometer-cold, url("/icons/thermometer-cold.svg"));
          mask: var(--icon-url-thermometer-cold, url("/icons/thermometer-cold.svg"));
}

.svg-thermometer-hot {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-thermometer-hot, url("/icons/thermometer-hot.svg"));
          mask: var(--icon-url-thermometer-hot, url("/icons/thermometer-hot.svg"));
}

.svg-thermometer-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-thermometer-simple, url("/icons/thermometer-simple.svg"));
          mask: var(--icon-url-thermometer-simple, url("/icons/thermometer-simple.svg"));
}

.svg-thermometer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-thermometer, url("/icons/thermometer.svg"));
          mask: var(--icon-url-thermometer, url("/icons/thermometer.svg"));
}

.svg-threads-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-threads-logo, url("/icons/threads-logo.svg"));
          mask: var(--icon-url-threads-logo, url("/icons/threads-logo.svg"));
}

.svg-three-d {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-three-d, url("/icons/three-d.svg"));
          mask: var(--icon-url-three-d, url("/icons/three-d.svg"));
}

.svg-thumbs-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-thumbs-down, url("/icons/thumbs-down.svg"));
          mask: var(--icon-url-thumbs-down, url("/icons/thumbs-down.svg"));
}

.svg-thumbs-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-thumbs-up, url("/icons/thumbs-up.svg"));
          mask: var(--icon-url-thumbs-up, url("/icons/thumbs-up.svg"));
}

.svg-ticket {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-ticket, url("/icons/ticket.svg"));
          mask: var(--icon-url-ticket, url("/icons/ticket.svg"));
}

.svg-tidal-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tidal-logo, url("/icons/tidal-logo.svg"));
          mask: var(--icon-url-tidal-logo, url("/icons/tidal-logo.svg"));
}

.svg-tiktok-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tiktok-logo, url("/icons/tiktok-logo.svg"));
          mask: var(--icon-url-tiktok-logo, url("/icons/tiktok-logo.svg"));
}

.svg-tilde {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tilde, url("/icons/tilde.svg"));
          mask: var(--icon-url-tilde, url("/icons/tilde.svg"));
}

.svg-timer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-timer, url("/icons/timer.svg"));
          mask: var(--icon-url-timer, url("/icons/timer.svg"));
}

.svg-tip-jar {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tip-jar, url("/icons/tip-jar.svg"));
          mask: var(--icon-url-tip-jar, url("/icons/tip-jar.svg"));
}

.svg-tipi {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tipi, url("/icons/tipi.svg"));
          mask: var(--icon-url-tipi, url("/icons/tipi.svg"));
}

.svg-tire {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tire, url("/icons/tire.svg"));
          mask: var(--icon-url-tire, url("/icons/tire.svg"));
}

.svg-toggle-left {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-toggle-left, url("/icons/toggle-left.svg"));
          mask: var(--icon-url-toggle-left, url("/icons/toggle-left.svg"));
}

.svg-toggle-right {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-toggle-right, url("/icons/toggle-right.svg"));
          mask: var(--icon-url-toggle-right, url("/icons/toggle-right.svg"));
}

.svg-toilet-paper {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-toilet-paper, url("/icons/toilet-paper.svg"));
          mask: var(--icon-url-toilet-paper, url("/icons/toilet-paper.svg"));
}

.svg-toilet {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-toilet, url("/icons/toilet.svg"));
          mask: var(--icon-url-toilet, url("/icons/toilet.svg"));
}

.svg-toolbox {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-toolbox, url("/icons/toolbox.svg"));
          mask: var(--icon-url-toolbox, url("/icons/toolbox.svg"));
}

.svg-tooth {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tooth, url("/icons/tooth.svg"));
          mask: var(--icon-url-tooth, url("/icons/tooth.svg"));
}

.svg-tornado {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tornado, url("/icons/tornado.svg"));
          mask: var(--icon-url-tornado, url("/icons/tornado.svg"));
}

.svg-tote-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tote-simple, url("/icons/tote-simple.svg"));
          mask: var(--icon-url-tote-simple, url("/icons/tote-simple.svg"));
}

.svg-tote {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tote, url("/icons/tote.svg"));
          mask: var(--icon-url-tote, url("/icons/tote.svg"));
}

.svg-towel {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-towel, url("/icons/towel.svg"));
          mask: var(--icon-url-towel, url("/icons/towel.svg"));
}

.svg-tractor {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tractor, url("/icons/tractor.svg"));
          mask: var(--icon-url-tractor, url("/icons/tractor.svg"));
}

.svg-trademark-registered {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trademark-registered, url("/icons/trademark-registered.svg"));
          mask: var(--icon-url-trademark-registered, url("/icons/trademark-registered.svg"));
}

.svg-trademark {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trademark, url("/icons/trademark.svg"));
          mask: var(--icon-url-trademark, url("/icons/trademark.svg"));
}

.svg-traffic-cone {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-traffic-cone, url("/icons/traffic-cone.svg"));
          mask: var(--icon-url-traffic-cone, url("/icons/traffic-cone.svg"));
}

.svg-traffic-sign {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-traffic-sign, url("/icons/traffic-sign.svg"));
          mask: var(--icon-url-traffic-sign, url("/icons/traffic-sign.svg"));
}

.svg-traffic-signal {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-traffic-signal, url("/icons/traffic-signal.svg"));
          mask: var(--icon-url-traffic-signal, url("/icons/traffic-signal.svg"));
}

.svg-train-regional {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-train-regional, url("/icons/train-regional.svg"));
          mask: var(--icon-url-train-regional, url("/icons/train-regional.svg"));
}

.svg-train-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-train-simple, url("/icons/train-simple.svg"));
          mask: var(--icon-url-train-simple, url("/icons/train-simple.svg"));
}

.svg-train {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-train, url("/icons/train.svg"));
          mask: var(--icon-url-train, url("/icons/train.svg"));
}

.svg-tram {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tram, url("/icons/tram.svg"));
          mask: var(--icon-url-tram, url("/icons/tram.svg"));
}

.svg-translate {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-translate, url("/icons/translate.svg"));
          mask: var(--icon-url-translate, url("/icons/translate.svg"));
}

.svg-trash-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trash-simple, url("/icons/trash-simple.svg"));
          mask: var(--icon-url-trash-simple, url("/icons/trash-simple.svg"));
}

.svg-trash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trash, url("/icons/trash.svg"));
          mask: var(--icon-url-trash, url("/icons/trash.svg"));
}

.svg-tray-arrow-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tray-arrow-down, url("/icons/tray-arrow-down.svg"));
          mask: var(--icon-url-tray-arrow-down, url("/icons/tray-arrow-down.svg"));
}

.svg-tray-arrow-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tray-arrow-up, url("/icons/tray-arrow-up.svg"));
          mask: var(--icon-url-tray-arrow-up, url("/icons/tray-arrow-up.svg"));
}

.svg-tray {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tray, url("/icons/tray.svg"));
          mask: var(--icon-url-tray, url("/icons/tray.svg"));
}

.svg-treasure-chest {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-treasure-chest, url("/icons/treasure-chest.svg"));
          mask: var(--icon-url-treasure-chest, url("/icons/treasure-chest.svg"));
}

.svg-tree-evergreen {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tree-evergreen, url("/icons/tree-evergreen.svg"));
          mask: var(--icon-url-tree-evergreen, url("/icons/tree-evergreen.svg"));
}

.svg-tree-palm {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tree-palm, url("/icons/tree-palm.svg"));
          mask: var(--icon-url-tree-palm, url("/icons/tree-palm.svg"));
}

.svg-tree-structure {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tree-structure, url("/icons/tree-structure.svg"));
          mask: var(--icon-url-tree-structure, url("/icons/tree-structure.svg"));
}

.svg-tree-view {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tree-view, url("/icons/tree-view.svg"));
          mask: var(--icon-url-tree-view, url("/icons/tree-view.svg"));
}

.svg-tree {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tree, url("/icons/tree.svg"));
          mask: var(--icon-url-tree, url("/icons/tree.svg"));
}

.svg-trend-down {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trend-down, url("/icons/trend-down.svg"));
          mask: var(--icon-url-trend-down, url("/icons/trend-down.svg"));
}

.svg-trend-up {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trend-up, url("/icons/trend-up.svg"));
          mask: var(--icon-url-trend-up, url("/icons/trend-up.svg"));
}

.svg-triangle-dashed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-triangle-dashed, url("/icons/triangle-dashed.svg"));
          mask: var(--icon-url-triangle-dashed, url("/icons/triangle-dashed.svg"));
}

.svg-triangle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-triangle, url("/icons/triangle.svg"));
          mask: var(--icon-url-triangle, url("/icons/triangle.svg"));
}

.svg-trolley-suitcase {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trolley-suitcase, url("/icons/trolley-suitcase.svg"));
          mask: var(--icon-url-trolley-suitcase, url("/icons/trolley-suitcase.svg"));
}

.svg-trolley {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trolley, url("/icons/trolley.svg"));
          mask: var(--icon-url-trolley, url("/icons/trolley.svg"));
}

.svg-trophy {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-trophy, url("/icons/trophy.svg"));
          mask: var(--icon-url-trophy, url("/icons/trophy.svg"));
}

.svg-truck-trailer {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-truck-trailer, url("/icons/truck-trailer.svg"));
          mask: var(--icon-url-truck-trailer, url("/icons/truck-trailer.svg"));
}

.svg-truck {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-truck, url("/icons/truck.svg"));
          mask: var(--icon-url-truck, url("/icons/truck.svg"));
}

.svg-tumblr-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-tumblr-logo, url("/icons/tumblr-logo.svg"));
          mask: var(--icon-url-tumblr-logo, url("/icons/tumblr-logo.svg"));
}

.svg-twitch-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-twitch-logo, url("/icons/twitch-logo.svg"));
          mask: var(--icon-url-twitch-logo, url("/icons/twitch-logo.svg"));
}

.svg-twitter-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-twitter-logo, url("/icons/twitter-logo.svg"));
          mask: var(--icon-url-twitter-logo, url("/icons/twitter-logo.svg"));
}

.svg-umbrella-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-umbrella-simple, url("/icons/umbrella-simple.svg"));
          mask: var(--icon-url-umbrella-simple, url("/icons/umbrella-simple.svg"));
}

.svg-umbrella {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-umbrella, url("/icons/umbrella.svg"));
          mask: var(--icon-url-umbrella, url("/icons/umbrella.svg"));
}

.svg-union {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-union, url("/icons/union.svg"));
          mask: var(--icon-url-union, url("/icons/union.svg"));
}

.svg-unite-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-unite-square, url("/icons/unite-square.svg"));
          mask: var(--icon-url-unite-square, url("/icons/unite-square.svg"));
}

.svg-unite {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-unite, url("/icons/unite.svg"));
          mask: var(--icon-url-unite, url("/icons/unite.svg"));
}

.svg-upload-simple {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-upload-simple, url("/icons/upload-simple.svg"));
          mask: var(--icon-url-upload-simple, url("/icons/upload-simple.svg"));
}

.svg-upload {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-upload, url("/icons/upload.svg"));
          mask: var(--icon-url-upload, url("/icons/upload.svg"));
}

.svg-usb {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-usb, url("/icons/usb.svg"));
          mask: var(--icon-url-usb, url("/icons/usb.svg"));
}

.svg-user-check {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-check, url("/icons/user-check.svg"));
          mask: var(--icon-url-user-check, url("/icons/user-check.svg"));
}

.svg-user-circle-check {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-circle-check, url("/icons/user-circle-check.svg"));
          mask: var(--icon-url-user-circle-check, url("/icons/user-circle-check.svg"));
}

.svg-user-circle-dashed {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-circle-dashed, url("/icons/user-circle-dashed.svg"));
          mask: var(--icon-url-user-circle-dashed, url("/icons/user-circle-dashed.svg"));
}

.svg-user-circle-gear {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-circle-gear, url("/icons/user-circle-gear.svg"));
          mask: var(--icon-url-user-circle-gear, url("/icons/user-circle-gear.svg"));
}

.svg-user-circle-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-circle-minus, url("/icons/user-circle-minus.svg"));
          mask: var(--icon-url-user-circle-minus, url("/icons/user-circle-minus.svg"));
}

.svg-user-circle-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-circle-plus, url("/icons/user-circle-plus.svg"));
          mask: var(--icon-url-user-circle-plus, url("/icons/user-circle-plus.svg"));
}

.svg-user-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-circle, url("/icons/user-circle.svg"));
          mask: var(--icon-url-user-circle, url("/icons/user-circle.svg"));
}

.svg-user-focus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-focus, url("/icons/user-focus.svg"));
          mask: var(--icon-url-user-focus, url("/icons/user-focus.svg"));
}

.svg-user-gear {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-gear, url("/icons/user-gear.svg"));
          mask: var(--icon-url-user-gear, url("/icons/user-gear.svg"));
}

.svg-user-list {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-list, url("/icons/user-list.svg"));
          mask: var(--icon-url-user-list, url("/icons/user-list.svg"));
}

.svg-user-minus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-minus, url("/icons/user-minus.svg"));
          mask: var(--icon-url-user-minus, url("/icons/user-minus.svg"));
}

.svg-user-plus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-plus, url("/icons/user-plus.svg"));
          mask: var(--icon-url-user-plus, url("/icons/user-plus.svg"));
}

.svg-user-rectangle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-rectangle, url("/icons/user-rectangle.svg"));
          mask: var(--icon-url-user-rectangle, url("/icons/user-rectangle.svg"));
}

.svg-user-sound {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-sound, url("/icons/user-sound.svg"));
          mask: var(--icon-url-user-sound, url("/icons/user-sound.svg"));
}

.svg-user-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-square, url("/icons/user-square.svg"));
          mask: var(--icon-url-user-square, url("/icons/user-square.svg"));
}

.svg-user-switch {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user-switch, url("/icons/user-switch.svg"));
          mask: var(--icon-url-user-switch, url("/icons/user-switch.svg"));
}

.svg-user {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-user, url("/icons/user.svg"));
          mask: var(--icon-url-user, url("/icons/user.svg"));
}

.svg-users-four {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-users-four, url("/icons/users-four.svg"));
          mask: var(--icon-url-users-four, url("/icons/users-four.svg"));
}

.svg-users-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-users-three, url("/icons/users-three.svg"));
          mask: var(--icon-url-users-three, url("/icons/users-three.svg"));
}

.svg-users {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-users, url("/icons/users.svg"));
          mask: var(--icon-url-users, url("/icons/users.svg"));
}

.svg-van {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-van, url("/icons/van.svg"));
          mask: var(--icon-url-van, url("/icons/van.svg"));
}

.svg-vault {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-vault, url("/icons/vault.svg"));
          mask: var(--icon-url-vault, url("/icons/vault.svg"));
}

.svg-vector-three {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-vector-three, url("/icons/vector-three.svg"));
          mask: var(--icon-url-vector-three, url("/icons/vector-three.svg"));
}

.svg-vector-two {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-vector-two, url("/icons/vector-two.svg"));
          mask: var(--icon-url-vector-two, url("/icons/vector-two.svg"));
}

.svg-vibrate {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-vibrate, url("/icons/vibrate.svg"));
          mask: var(--icon-url-vibrate, url("/icons/vibrate.svg"));
}

.svg-video-camera-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-video-camera-slash, url("/icons/video-camera-slash.svg"));
          mask: var(--icon-url-video-camera-slash, url("/icons/video-camera-slash.svg"));
}

.svg-video-camera {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-video-camera, url("/icons/video-camera.svg"));
          mask: var(--icon-url-video-camera, url("/icons/video-camera.svg"));
}

.svg-video-conference {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-video-conference, url("/icons/video-conference.svg"));
          mask: var(--icon-url-video-conference, url("/icons/video-conference.svg"));
}

.svg-video {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-video, url("/icons/video.svg"));
          mask: var(--icon-url-video, url("/icons/video.svg"));
}

.svg-vignette {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-vignette, url("/icons/vignette.svg"));
          mask: var(--icon-url-vignette, url("/icons/vignette.svg"));
}

.svg-vinyl-record {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-vinyl-record, url("/icons/vinyl-record.svg"));
          mask: var(--icon-url-vinyl-record, url("/icons/vinyl-record.svg"));
}

.svg-virtual-reality {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-virtual-reality, url("/icons/virtual-reality.svg"));
          mask: var(--icon-url-virtual-reality, url("/icons/virtual-reality.svg"));
}

.svg-virus {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-virus, url("/icons/virus.svg"));
          mask: var(--icon-url-virus, url("/icons/virus.svg"));
}

.svg-visor {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-visor, url("/icons/visor.svg"));
          mask: var(--icon-url-visor, url("/icons/visor.svg"));
}

.svg-voicemail {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-voicemail, url("/icons/voicemail.svg"));
          mask: var(--icon-url-voicemail, url("/icons/voicemail.svg"));
}

.svg-volleyball {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-volleyball, url("/icons/volleyball.svg"));
          mask: var(--icon-url-volleyball, url("/icons/volleyball.svg"));
}

.svg-wall {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wall, url("/icons/wall.svg"));
          mask: var(--icon-url-wall, url("/icons/wall.svg"));
}

.svg-wallet {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wallet, url("/icons/wallet.svg"));
          mask: var(--icon-url-wallet, url("/icons/wallet.svg"));
}

.svg-warehouse {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-warehouse, url("/icons/warehouse.svg"));
          mask: var(--icon-url-warehouse, url("/icons/warehouse.svg"));
}

.svg-warning-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-warning-circle, url("/icons/warning-circle.svg"));
          mask: var(--icon-url-warning-circle, url("/icons/warning-circle.svg"));
}

.svg-warning-diamond {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-warning-diamond, url("/icons/warning-diamond.svg"));
          mask: var(--icon-url-warning-diamond, url("/icons/warning-diamond.svg"));
}

.svg-warning-octagon {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-warning-octagon, url("/icons/warning-octagon.svg"));
          mask: var(--icon-url-warning-octagon, url("/icons/warning-octagon.svg"));
}

.svg-warning {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-warning, url("/icons/warning.svg"));
          mask: var(--icon-url-warning, url("/icons/warning.svg"));
}

.svg-washing-machine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-washing-machine, url("/icons/washing-machine.svg"));
          mask: var(--icon-url-washing-machine, url("/icons/washing-machine.svg"));
}

.svg-watch {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-watch, url("/icons/watch.svg"));
          mask: var(--icon-url-watch, url("/icons/watch.svg"));
}

.svg-wave-sawtooth {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wave-sawtooth, url("/icons/wave-sawtooth.svg"));
          mask: var(--icon-url-wave-sawtooth, url("/icons/wave-sawtooth.svg"));
}

.svg-wave-sine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wave-sine, url("/icons/wave-sine.svg"));
          mask: var(--icon-url-wave-sine, url("/icons/wave-sine.svg"));
}

.svg-wave-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wave-square, url("/icons/wave-square.svg"));
          mask: var(--icon-url-wave-square, url("/icons/wave-square.svg"));
}

.svg-wave-triangle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wave-triangle, url("/icons/wave-triangle.svg"));
          mask: var(--icon-url-wave-triangle, url("/icons/wave-triangle.svg"));
}

.svg-waveform-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-waveform-slash, url("/icons/waveform-slash.svg"));
          mask: var(--icon-url-waveform-slash, url("/icons/waveform-slash.svg"));
}

.svg-waveform {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-waveform, url("/icons/waveform.svg"));
          mask: var(--icon-url-waveform, url("/icons/waveform.svg"));
}

.svg-waves {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-waves, url("/icons/waves.svg"));
          mask: var(--icon-url-waves, url("/icons/waves.svg"));
}

.svg-webcam-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-webcam-slash, url("/icons/webcam-slash.svg"));
          mask: var(--icon-url-webcam-slash, url("/icons/webcam-slash.svg"));
}

.svg-webcam {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-webcam, url("/icons/webcam.svg"));
          mask: var(--icon-url-webcam, url("/icons/webcam.svg"));
}

.svg-webhooks-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-webhooks-logo, url("/icons/webhooks-logo.svg"));
          mask: var(--icon-url-webhooks-logo, url("/icons/webhooks-logo.svg"));
}

.svg-wechat-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wechat-logo, url("/icons/wechat-logo.svg"));
          mask: var(--icon-url-wechat-logo, url("/icons/wechat-logo.svg"));
}

.svg-whatsapp-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-whatsapp-logo, url("/icons/whatsapp-logo.svg"));
          mask: var(--icon-url-whatsapp-logo, url("/icons/whatsapp-logo.svg"));
}

.svg-wheelchair-motion {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wheelchair-motion, url("/icons/wheelchair-motion.svg"));
          mask: var(--icon-url-wheelchair-motion, url("/icons/wheelchair-motion.svg"));
}

.svg-wheelchair {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wheelchair, url("/icons/wheelchair.svg"));
          mask: var(--icon-url-wheelchair, url("/icons/wheelchair.svg"));
}

.svg-wifi-high {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wifi-high, url("/icons/wifi-high.svg"));
          mask: var(--icon-url-wifi-high, url("/icons/wifi-high.svg"));
}

.svg-wifi-low {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wifi-low, url("/icons/wifi-low.svg"));
          mask: var(--icon-url-wifi-low, url("/icons/wifi-low.svg"));
}

.svg-wifi-medium {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wifi-medium, url("/icons/wifi-medium.svg"));
          mask: var(--icon-url-wifi-medium, url("/icons/wifi-medium.svg"));
}

.svg-wifi-none {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wifi-none, url("/icons/wifi-none.svg"));
          mask: var(--icon-url-wifi-none, url("/icons/wifi-none.svg"));
}

.svg-wifi-slash {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wifi-slash, url("/icons/wifi-slash.svg"));
          mask: var(--icon-url-wifi-slash, url("/icons/wifi-slash.svg"));
}

.svg-wifi-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wifi-x, url("/icons/wifi-x.svg"));
          mask: var(--icon-url-wifi-x, url("/icons/wifi-x.svg"));
}

.svg-wind {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wind, url("/icons/wind.svg"));
          mask: var(--icon-url-wind, url("/icons/wind.svg"));
}

.svg-windmill {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-windmill, url("/icons/windmill.svg"));
          mask: var(--icon-url-windmill, url("/icons/windmill.svg"));
}

.svg-windows-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-windows-logo, url("/icons/windows-logo.svg"));
          mask: var(--icon-url-windows-logo, url("/icons/windows-logo.svg"));
}

.svg-wine {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wine, url("/icons/wine.svg"));
          mask: var(--icon-url-wine, url("/icons/wine.svg"));
}

.svg-wrench {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-wrench, url("/icons/wrench.svg"));
          mask: var(--icon-url-wrench, url("/icons/wrench.svg"));
}

.svg-x-circle {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-x-circle, url("/icons/x-circle.svg"));
          mask: var(--icon-url-x-circle, url("/icons/x-circle.svg"));
}

.svg-x-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-x-logo, url("/icons/x-logo.svg"));
          mask: var(--icon-url-x-logo, url("/icons/x-logo.svg"));
}

.svg-x-square {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-x-square, url("/icons/x-square.svg"));
          mask: var(--icon-url-x-square, url("/icons/x-square.svg"));
}

.svg-x {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-x, url("/icons/x.svg"));
          mask: var(--icon-url-x, url("/icons/x.svg"));
}

.svg-yarn {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-yarn, url("/icons/yarn.svg"));
          mask: var(--icon-url-yarn, url("/icons/yarn.svg"));
}

.svg-yin-yang {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-yin-yang, url("/icons/yin-yang.svg"));
          mask: var(--icon-url-yin-yang, url("/icons/yin-yang.svg"));
}

.svg-youtube-logo {
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: 1;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-size: cover;
          mask-size: cover;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask: var(--icon-url-youtube-logo, url("/icons/youtube-logo.svg"));
          mask: var(--icon-url-youtube-logo, url("/icons/youtube-logo.svg"));
}

/* ================================================== */
/* Responsive height values for small UI */
/* ================================================== */
:root {
  --g3d-ui-h-xs: 1.4rem;
  --g3d-ui-h-sm: 1.5rem;
  --g3d-ui-h-md: 2rem;
  --g3d-ui-h-lg: 2.6rem;
  --g3d-ui-h-xl: 3.375rem;
}
@media (width >= 30.5rem) {
  :root {
    --g3d-ui-h-sm: 1.6rem;
    --g3d-ui-h-md: 2.1rem;
  }
}
@media (width >= 48rem) {
  :root {
    --g3d-ui-h-xs: 1.5rem;
    --g3d-ui-h-sm: 1.7rem;
  }
}
@media (width >= 64rem) {
  :root {
    --g3d-ui-h-xs: 1.55rem;
    --g3d-ui-h-sm: 1.75rem;
    --g3d-ui-h-md: 2.375rem;
    --g3d-ui-h-lg: 3rem;
    --g3d-ui-h-xl: 3.5rem;
  }
}
@media (width >= 80rem) {
  :root {
    --g3d-ui-h-xs: 1.6rem;
  }
}

.g3d-ui-h-xs {
  height: var(--g3d-ui-h-xs);
}

.g3d-ui-h-sm {
  height: var(--g3d-ui-h-sm);
}

.g3d-ui-h-md {
  height: var(--g3d-ui-h-md);
}

.g3d-ui-h-lg {
  height: var(--g3d-ui-h-lg);
}

.g3d-ui-h-xl {
  height: var(--g3d-ui-h-xl);
}

/* ================================================== */
/* Glass Layering & z-index */
/* ================================================== */
/** Glass components in this library are designed to layer cleanly,
* by using CSS custom properties and the cascade up pattern:
* 
* Each UI component sets a base z-index via a variable e.g. --g3d-z-card: 20
*
* Direct child elements (such as buttons) “cascade up” by setting their own --glass-z  * to a higher value, so they always stack above their container.
*
* Glass classes use their container's or element's z-index to set z-index values
* for their ::before and ::after pseudo elements. 
*/
:root {
  --g3d-z-page-bg: -10;
  --g3d-z-page-overlay: 0;
  --g3d-z-page-content: 1;
  --g3d-z-surface: 10;
  --g3d-z-card: 20;
  --g3d-z-footer: 30;
  --g3d-z-drawer: 40;
  --g3d-z-nav: 50;
  --g3d-z-dropdown: 60;
  --g3d-z-toast: 70;
  --g3d-z-overlay: 80;
  --g3d-z-modal: 90;
  --g3d-z-loading: 100;
  --g3d-z-tooltip: 110;
  --g3d-z-context-menu: 120;
  --g3d-z-popover: 130;
  --g3d-z-focus-ring: 900;
}

/** 💠 Example
* 
* Container sets a base z-index:
*  .g3d-card { --glass-z: var(--g3d-z-card); }
*
* Child elements bump their layer up to a higher value.
*  .g3d-card > .g3d-btn-sm { --glass-z: calc(var(--g3d-z-card) + 3); }
*
* Glass elements use the --glass-z variable for stacking
*  .g3d-glass-3d { z-index: var(--glass-z, 1); }
*  .g3d-glass-3d::before  { z-index: calc(var(--glass-z, 1) - 1); }
*  .g3d-glass-3d::after   { z-index: calc(var(--glass-z, 1) + 1); }
*
* <div class="g3d-card g3d-glass-3d">
*   <button class="g3d-btn-sm g3d-glass-ui">Glass Button</button>
* </div>
*
* result 
* g3d-card::before -> z-index: 19
* g3d-card ->         z-index: 20
* g3d-card::after ->  z-index: 21
* btn::before ->  z-index: 22
* btn ->          z-index: 23
* btn::after ->   z-index: 24
*/
/* ================================================== */
/* Motion */
/* ================================================== */
:root {
  --g3d-speed-2xslow: 700ms;
  --g3d-speed-xslow: 600ms;
  --g3d-speed-slow: 500ms;
  --g3d-speed-base: 400ms;
  --g3d-speed-fast: 300ms;
  --g3d-speed-xfast: 250ms;
  --g3d-speed-2xfast: 200ms;
  --g3d-smooth-cubic: cubic-bezier(0.46, 0.42, 0.1, 0.98);
  --g3d-crisp-responsive: cubic-bezier(0.39, 0.03, 0.15, 1);
  --g3d-frictionless-ease: cubic-bezier(0.37, 0.66, 0.03, 1);
  --g3d-elegant-glide: cubic-bezier(0.42, 0.04, 0.56, 0.96);
  --g3d-snappy-settle: cubic-bezier(0.16 , 1, 0.3, 0.99);
  --g3d-subtle-spring: cubic-bezier(0.66, -0.3, 0.3, 1.33);
}

/** Frictionless Ease
* How it feels: refined, cinematic
* Use for: Card reveals, image transitions
*/
.g3d-frictionless-ease {
  transition: all var(--g3d-speed-xslow) var(--g3d-frictionless-ease);
}

/** Elegant Glide
* How it feels: polished
* Use for: Parallax, overlay fades, big hero image shifts
*/
.g3d-elegant-glide {
  transition: all var(--g3d-speed-xslow) var(--g3d-elegant-glide);
}

/** Crisp Responsive
* How it feels: professional but soft
* Use for: Button hovers
*/
.g3d-crisp-responsive {
  transition: all var(--g3d-speed-xfast) var(--g3d-crisp-responsive);
}

/** Snappy Settle
* How it feels: Starts with intent, lands gracefully
* Use for: Notification banners, toast messages.
*/
.g3d-snappy-settle {
  transition: all var(--g3d-speed-base) var(--g3d-snappy-settle);
}

/** Subtle Spring
* How it feels: A slight, non-cartoonish bounce on finish.
* Use for: micro-interactions, playful moments.
*/
.g3d-subtle-spring {
  transition: all var(--g3d-speed-base) var(--g3d-subtle-spring);
}

/* ================================================== */
/* Aggregate decorative rules for CSS output */
/* ================================================== */
/* ================================================== */
/* Insets */
/* ================================================== */
:root {
  /* Insets */
  /* ================================================== */
  --g3d-inset-xs:
    inset -2px -2px 1px -3.25px hsl(var(--g3d-highlight) / 0.99),
    inset -0.5px -0.5px 0.5px -0.25px hsl(var(--g3d-highlight) / 0.3),
    inset -0.75px -0.75px 0.25px hsl(var(--g3d-highlight) / 0.1),
    inset 0.5px 0.5px 0.5px -0.5px hsl(var(--g3d-shadow) / 0.1),
    inset 0.25px 0.25px 1.25px hsl(var(--g3d-shadow) / 0.15),
    inset 1px 1px 2px hsl(var(--g3d-shadow) / 0.15),
    inset 2px 2px 16px -8px hsl(var(--g3d-shadow) / 0.2);
  --g3d-inset-sm:
    inset -2px -2px 1px -3.25px hsl(var(--g3d-highlight) / 0.99),
    inset -0.5px -0.5px 0.5px -0.25px hsl(var(--g3d-highlight) / 0.3),
    inset -0.75px -0.75px 0.25px hsl(var(--g3d-highlight) / 0.1),
    inset 0.5px 0.5px 0.5px -0.5px hsl(var(--g3d-shadow) / 0.1),
    inset 0.25px 0.25px 1.25px hsl(var(--g3d-shadow) / 0.2),
    inset 1px 1px 2px hsl(var(--g3d-shadow) / 0.2),
    inset 2px 2px 16px -8px hsl(var(--g3d-shadow) / 0.25);
  --g3d-inset-md:
    inset -2px -2px 1px -3.25px hsl(var(--g3d-highlight) / 0.99),
    inset -1px -1px 0.75px -0.75px hsl(var(--g3d-highlight) / 0.4),
    inset -1px -1px 0.25px hsl(var(--g3d-highlight) / 0.1),
    inset 0.75px 0.75px 1px -0.25px hsl(var(--g3d-shadow) / 0.1),
    inset 0.25px 0.25px 1.25px hsl(var(--g3d-shadow) / 0.2),
    inset 1.25px 1.25px 2px hsl(var(--g3d-shadow) / 0.2),
    inset 2px 2px 16px -8px hsl(var(--g3d-shadow) / 0.25);
  --g3d-inset-lg:
    inset -2px -2px 1px -3.25px hsl(var(--g3d-highlight) / 0.99),
    inset -1.25px -1.25px 1px -0.75px hsl(var(--g3d-highlight) / 0.4),
    inset -1.25px -1.25px 0.25px hsl(var(--g3d-highlight) / 0.1),
    inset 0.75px 0.75px 1px -0.25px hsl(var(--g3d-shadow) / 0.1),
    inset 0.25px 0.25px 1.25px hsl(var(--g3d-shadow) / 0.2),
    inset 1.5px 1.5px 2.25px hsl(var(--g3d-shadow) / 0.2),
    inset 4px 4px 18px -10px hsl(var(--g3d-shadow) / 0.25);
  /* Flat insets  */
  /* ================================================== */
  --g3d-inset-flat-sm:
    inset 0 -0.75px 0.75px -0.8px hsl(var(--g3d-highlight) / 0.4),
    inset 0 -0.75px 0.25px -0.25px hsl(var(--g3d-highlight) / 0.15),
    inset 0 0.5px 0.5px -0.55px hsl(var(--g3d-shadow) / 0.1),
    inset 0 1.5px 1.5px -1.55px hsl(var(--g3d-shadow) / 0.2),
    inset 0 2px 2px -2.25px hsl(var(--g3d-shadow) / 0.35),
    inset 0 12px 12px -13px hsl(var(--g3d-shadow) / 0.2);
  --g3d-inset-flat-md:
    inset 0 -1px 1px -1.05px hsl(var(--g3d-highlight) / 0.4),
    inset 0 -1px 0.25px -0.25px hsl(var(--g3d-highlight) / 0.15),
    inset 0 0.5px 0.5px -0.55px hsl(var(--g3d-shadow) / 0.1),
    inset 0 2px 2px -2.25px hsl(var(--g3d-shadow) / 0.25),
    inset 0 3px 3px -3.25px hsl(var(--g3d-shadow) / 0.35),
    inset 0 14px 14px -15px hsl(var(--g3d-shadow) / 0.2);
  --g3d-inset-flat-lg:
    inset 0 -1.5px 1.5px -1.55px hsl(var(--g3d-highlight) / 0.4),
    inset 0 -1.5px 0.25px -0.25px hsl(var(--g3d-highlight) / 0.15),
    inset 0 0.5px 0.5px -0.55px hsl(var(--g3d-shadow) / 0.15),
    inset 0 2.5px 2.5px -2.75px hsl(var(--g3d-shadow) / 0.25),
    inset 0 4px 4px -4.25px hsl(var(--g3d-shadow) / 0.35),
    inset 0 16px 16px -17px hsl(var(--g3d-shadow) / 0.2);
}

/* ================================================== */
/* Overhang box-shadows */
/* ================================================== */
/** Add to an element to make it look like it's lower
* than the element right above it 
*/
:root {
  --g3d-overhang-xs:
    inset 0 0.5px 1px -1px hsl(var(--g3d-shadow) / 0.5),
    inset 0 1px 2px -2px hsl(var(--g3d-shadow) / 0.5),
    inset 0 2px 4px -4px hsl(var(--g3d-shadow) / 0.3);
  --g3d-overhang-sm:
    inset 0 0.5px 1px -1px hsl(var(--g3d-shadow) / 0.7),
    inset 0 1px 2px -2px hsl(var(--g3d-shadow) / 0.5),
    inset 0 2px 4px -4px hsl(var(--g3d-shadow) / 0.3),
    inset 0 4px 8px -8px hsl(var(--g3d-shadow) / 0.3);
  --g3d-overhang-md:
    inset 0 0.5px 1px -1px hsl(var(--g3d-shadow) / 0.5),
    inset 0 1px 2px -2px hsl(var(--g3d-shadow) / 0.5),
    inset 0 2px 4px -4px hsl(var(--g3d-shadow) / 0.5),
    inset 0 6px 12px -12px hsl(var(--g3d-shadow) / 0.3);
  --g3d-overhang-lg:
    inset 0 0.5px 1px -1px hsl(var(--g3d-shadow) / 0.4),
    inset 0 2px 4px -4px hsl(var(--g3d-shadow) / 0.5),
    inset 0 4px 8px -8px hsl(var(--g3d-shadow) / 0.5),
    inset 0 8px 16px -16px hsl(var(--g3d-shadow) / 0.3);
  --g3d-overhang-xl:
    inset 0 0.5px 1px -1px hsl(var(--g3d-shadow) / 0.4),
    inset 0 4px 8px -8px hsl(var(--g3d-shadow) / 0.5),
    inset 0 8px 16px -16px hsl(var(--g3d-shadow) / 0.5),
    inset 0 10px 20px -20px hsl(var(--g3d-shadow) / 0.3);
}

/* ================================================== */
/* Text shadows */
/* ================================================== */
:root {
  --g3d-text-shadow-3xs:
    0.2px 0 0.2px hsl(var(--g3d-shadow) / 0.1),
    0.2px 0.2px 0.2px hsl(var(--g3d-shadow) / 0.2),
    0.25px 0.25px 0.5px hsl(var(--g3d-shadow) / 0.1),
    0 0 0.05em hsl(var(--g3d-shadow) / 0.1),
    0 0 0.7em hsl(var(--g3d-shadow) / 0.15);
  --g3d-text-shadow-2xs:
    0.2px 0 0.2px hsl(var(--g3d-shadow) / 0.1),
    0.25px 0.25px 0.25px hsl(var(--g3d-shadow) / 0.2),
    0.25px 0.25px 0.5px hsl(var(--g3d-shadow) / 0.1),
    0 0 0.05em hsl(var(--g3d-shadow) / 0.1),
    0 0 0.7em hsl(var(--g3d-shadow) / 0.15);
  --g3d-text-shadow-xs:
    0.1px 0.1px hsl(var(--g3d-shadow) / 0.3),
    0.25px 0.25px hsl(var(--g3d-shadow) / 0.35),
    0.02em 0.02em 0.04em hsl(var(--g3d-shadow) / 0.2),
    0 0 0.05em hsl(var(--g3d-shadow) / 0.2),
    0 0 0.7em hsl(var(--g3d-shadow) / 0.2);
  --g3d-text-shadow-sm:
    -0.1px 0.1px hsl(var(--g3d-highlight) / 0.4),
    -0.5px 0.5px 0.5px hsl(var(--g3d-highlight) / 0.3),
    -0.5px 0.5px hsl(var(--g3d-shadow) / 0.5),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.5),
    -0.5px 0.5px 0.75px hsl(var(--g3d-shadow) / 0.3);
  --g3d-text-shadow-md:
    0.1px 0.1px hsl(var(--g3d-shadow) / 0.3),
    0.3px 0.3px hsl(var(--g3d-shadow) / 0.3),
    0.4px 0.4px 0.8px hsl(var(--g3d-shadow) / 0.2),
    0 0 2px hsl(var(--g3d-shadow) / 0.2);
  --g3d-text-shadow-lg:
    0.25px 0 0.25px hsl(var(--g3d-shadow) / 0.1),
    0.45px 0.45px 0.45px hsl(var(--g3d-shadow) / 0.25),
    0.75px 0.75px 1.5px hsl(var(--g3d-shadow) / 0.1),
    0 0 0.05em hsl(var(--g3d-shadow) / 0.1),
    0 0 0.7em hsl(var(--g3d-shadow) / 0.2);
  --g3d-text-shadow-xl:
    0.25px 0 0.25px hsl(var(--g3d-shadow) / 0.1),
    0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.25),
    0.75px 0.75px 1.5px hsl(var(--g3d-shadow) / 0.1),
    0 0 0.05em hsl(var(--g3d-shadow) / 0.1),
    0 0 0.7em hsl(var(--g3d-shadow) / 0.2);
  --g3d-text-shadow-2xl:
    0.25px 0 0.25px hsl(var(--g3d-shadow) / 0.1),
    0.55px 0.55px 0.55px hsl(var(--g3d-shadow) / 0.25),
    1px 1px 2px hsl(var(--g3d-shadow) / 0.1),
    0 0 0.05em hsl(var(--g3d-shadow) / 0.1),
    0 0 0.7em hsl(var(--g3d-shadow) / 0.2);
  --g3d-text-shadow-3xl:
    0.25px 0 0.25px hsl(var(--g3d-shadow) / 0.1),
    0.6px 0.6px 0.6px hsl(var(--g3d-shadow) / 0.25),
    1px 1px 2px hsl(var(--g3d-shadow) / 0.1),
    0 0 0.05em hsl(var(--g3d-shadow) / 0.1),
    0 0 0.7em hsl(var(--g3d-shadow) / 0.2);
}

/* ================================================== */
/* Aggregate glass rules for CSS output */
/* ================================================== */
/* ================================================== */
/* Fixed background panel */
/* ================================================== */
/** Fill whole page background with fixed img or video
* computationally heavy because of repaint on scroll
* but necessary if using glass elements
*/
/* Page background bin */
.g3d-fixed-page-bg-bin {
  z-index: var(--g3d-z-page-bg);
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

/* Background image or video */
.g3d-fixed-page-bg-media {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

/* Optional layer over background */
/* ================================================== */
/* Aggregate interaction rules for CSS output */
/* ================================================== */
/* ================================================== */
/* Focus */
/* ================================================== */
/* :focus-visible */
/* ================================================== */
:focus-visible {
  box-shadow: inset 0 0 0 1px hsl(var(--g3d-primary-hs) 50%/0.5), inset 0 0 0 1.5px hsl(var(--g3d-primary-hs) 50%/0.4), inset 0 0 0 2px hsl(var(--g3d-primary-hs) 50%/0.2) !important;
}

:focus {
  outline: 1px solid transparent;
}

/* Components/features */
/* ================================================== */
/* ================================================== */
/* Aggregate component rules for CSS output */
/* ================================================== */
/* ================================================== */
/* Chip */
/* ================================================== */
/* Forward all style abstracts */
/* ================================================== */
/* ================================================== */
/* Forward abstracts */
/* ================================================== */
/* ================================================== */
/* Functions */
/* ================================================== */
/* ================================================== */
/* Layout utils */
/* ================================================== */
/* Border Radius */
/* ================================================== */
/* Spacing */
/* ================================================== */
:root {
  /* Small sizes */
  --g3d-5xs: 0.25rem;
  --g3d-4xs: 0.5rem;
  --g3d-3xs: 0.75rem;
  --g3d-2xs: 0.875rem;
  --g3d-xs: 1rem;
  /* Fluid sizes */
  --g3d-sm: clamp(1rem, calc(2vw + 0.5rem), 1.5rem);
  --g3d-md: clamp(1.25rem, calc(2vw + 0.85rem), 2rem);
  --g3d-lg: clamp(1.5rem, calc(2vw + 1rem), 2.5rem);
  --g3d-xl: clamp(1.75rem, calc(2vw + 1.4rem), 3rem);
  --g3d-2xl: clamp(2rem, calc(2vw + 1.6rem), 3.5rem);
  --g3d-3xl: clamp(3rem, calc(2vw + 2.6rem), 4.5rem);
  --g3d-4xl: clamp(4rem, calc(2vw + 3.6rem), 6rem);
  --g3d-5xl: clamp(5rem, calc(2vw + 4.6rem), 7.5rem);
}

/* ================================================== */
/* Layout utils */
/* ================================================== */
/* Conditional border-radius */
/* ================================================== */
/* TODO -> Conditional border-radius bin */
/* ================================================== */
/* TODO -> Conditional Radius bin */
/* ================================================== */
/* This parent class helps remove janky rendering artifacts that occur in some browsers when inset box-shadow + border-radius are used on the same element.
The solution though not perfect is to add a parent wrapper that sets the border-radius while the child sets the inset box-shadow */
/* TODO -> Conditional Border radius classes */
/* ================================================== */
/* Generates classes using the $sizes map from _spacing.scss */
.g3d-radius-5xs {
  border-radius: var(--g3d-5xs);
}
.g3d-radius-4xs {
  border-radius: var(--g3d-4xs);
}
.g3d-radius-3xs {
  border-radius: var(--g3d-3xs);
}
.g3d-radius-2xs {
  border-radius: var(--g3d-2xs);
}
.g3d-radius-xs {
  border-radius: var(--g3d-xs);
}
.g3d-radius-sm {
  border-radius: var(--g3d-sm);
}
.g3d-radius-md {
  border-radius: var(--g3d-md);
}
.g3d-radius-lg {
  border-radius: var(--g3d-lg);
}
.g3d-radius-xl {
  border-radius: var(--g3d-xl);
}
.g3d-radius-2xl {
  border-radius: var(--g3d-2xl);
}
.g3d-radius-3xl {
  border-radius: var(--g3d-3xl);
}
.g3d-radius-4xl {
  border-radius: var(--g3d-4xl);
}
.g3d-radius-5xl {
  border-radius: var(--g3d-5xl);
}

/* Nested border radii */
/* ================================================== */
/* ================================================== */
/* Forward glass */
/* ================================================== */
/* ================================================== */
/* Glass */
/* ================================================== */
/* Forward token abstracts */
/* ================================================== */
/* ================================================== */
/* Forward all style abstracts */
/* ================================================== */
/* ================================================== */
/* ================================================== */
/* Glass Template Mixin */
/* ================================================== */
/* Backdrop filter mixin */
/* ================================================== */
/** 💠 Example
* .my-class {
*   @include g3d-glass-filter(20px, 1.2, 1.5);
* }
*/
/* ================================================== */
/* Aggregate interaction rules for CSS output */
/* ================================================== */
/* ================================================== */
/* Forward interaction abstracts */
/* ================================================== */
/* ================================================== */
/* Glass */
/* ================================================== */
/* Chip */
/* ================================================== */
/* Button */
/* ================================================== */
/* Button transitions ✨ Config these values */
/* ================================================== */
/* Button text ✨ Config these values */
/* ================================================== */
/* ================================================== */
/* Button structure */
/* ================================================== */
/* Button sizes ✨ Config these values */
/* ================================================== */
.g3d-btn-sm {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  position: relative;
  z-index: 33;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  gap: var(--_btn-gap);
  border-radius: var(--_btn-radius);
  pointer-events: auto;
  cursor: pointer;
}
.g3d-btn-sm::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 35;
}
.g3d-btn-sm::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 31;
}
.g3d-btn-sm > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  text-shadow: var(--g3d-text-shadow-sm);
  z-index: 37;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-sm > svg {
  z-index: 37;
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-sm.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-sm.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
.g3d-btn-sm {
  --btn-h: var(--g3d-ui-h-sm);
  --btn-content-h: calc(var(--btn-h) * 0.2);
  --btn-padding-x: calc(var(--btn-h) * 0.55);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: 999px;
}
@media (width >= 30.5rem) {
  .g3d-btn-sm {
    --btn-content-h: 0.95rem;
  }
}

.g3d-btn-md {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  position: relative;
  z-index: 33;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  gap: var(--_btn-gap);
  border-radius: var(--_btn-radius);
  pointer-events: auto;
  cursor: pointer;
}
.g3d-btn-md::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 35;
}
.g3d-btn-md::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 31;
}
.g3d-btn-md > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  text-shadow: var(--g3d-text-shadow-sm);
  z-index: 37;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-md > svg {
  z-index: 37;
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-md.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-md.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
.g3d-btn-md {
  --btn-h: var(--g3d-ui-h-md);
  --btn-content-h: 0.95rem;
  --btn-padding-x: calc(var(--btn-h) * 0.6);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: 999px;
}
@media (width >= 30.5rem) {
  .g3d-btn-md {
    --btn-content-h: 1.15rem;
  }
}

.g3d-btn-lg {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  position: relative;
  z-index: 33;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  gap: var(--_btn-gap);
  border-radius: var(--_btn-radius);
  pointer-events: auto;
  cursor: pointer;
}
.g3d-btn-lg::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 35;
}
.g3d-btn-lg::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 31;
}
.g3d-btn-lg > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  text-shadow: var(--g3d-text-shadow-sm);
  z-index: 37;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-lg > svg {
  z-index: 37;
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-lg.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-lg.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
.g3d-btn-lg {
  --btn-h: var(--g3d-ui-h-lg);
  --btn-content-h: 1rem;
  --btn-padding-x: calc(var(--btn-h) * 0.65);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: 999px;
}
@media (width >= 30.5rem) {
  .g3d-btn-lg {
    --btn-content-h: 1.25rem;
  }
}

.g3d-btn-full-w {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  position: relative;
  z-index: 33;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  gap: var(--_btn-gap);
  border-radius: var(--_btn-radius);
  pointer-events: auto;
  cursor: pointer;
}
.g3d-btn-full-w::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 35;
}
.g3d-btn-full-w::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 31;
}
.g3d-btn-full-w > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  text-shadow: var(--g3d-text-shadow-sm);
  z-index: 37;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-full-w > svg {
  z-index: 37;
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-full-w.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-full-w.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
.g3d-btn-full-w {
  width: 100%;
  --btn-h: var(--g3d-ui-h-xl);
  --btn-content-h: 1.25rem;
  --btn-padding-x: calc(var(--btn-h) * 0.7);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: var(--g3d-2xs);
}

.g3d-btn-full-w-sm {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  position: relative;
  z-index: 33;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  gap: var(--_btn-gap);
  border-radius: var(--_btn-radius);
  pointer-events: auto;
  cursor: pointer;
}
.g3d-btn-full-w-sm::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 35;
}
.g3d-btn-full-w-sm::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: 31;
}
.g3d-btn-full-w-sm > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  text-shadow: var(--g3d-text-shadow-sm);
  z-index: 37;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-full-w-sm > svg {
  z-index: 37;
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-full-w-sm.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-full-w-sm.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
.g3d-btn-full-w-sm {
  width: 100%;
  --btn-h: var(--g3d-ui-h-sm);
  --btn-content-h: calc(var(--btn-h) * 0.55);
  --btn-padding-x: calc(var(--btn-h) * 0.7);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: var(--g3d-2xs);
}

/* ================================================== */
/* Round icon button structure */
/* ================================================== */
/* Icon button sizes ✨ Config these values */
/* ================================================== */
.g3d-btn-icon-sm {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-icon-h: var(--btn-icon-h, 1rem);
  position: relative;
  z-index: 33;
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--_btn-h);
  height: var(--_btn-h);
  border-radius: 999px;
  pointer-events: auto;
  cursor: pointer;
}
.g3d-btn-icon-sm::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}
.g3d-btn-icon-sm::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}
.g3d-btn-icon-sm > svg {
  z-index: 37;
  height: var(--_btn-icon-h);
  width: var(--_btn-icon-h);
  aspect-ratio: 1;
  pointer-events: none;
  will-change: width, height;
  transition: width var(--g3d-speed-base) var(--g3d-smooth-cubic), height var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.g3d-btn-icon-sm:hover > svg {
  width: calc(var(--_btn-icon-h) * 1.1);
  height: calc(var(--_btn-icon-h) * 1.1);
}
.g3d-btn-icon-sm {
  --btn-h: var(--g3d-ui-h-sm);
  --btn-icon-h: calc(var(--btn-h) * 0.55);
}

.g3d-btn-icon-md {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-icon-h: var(--btn-icon-h, 1rem);
  position: relative;
  z-index: 33;
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--_btn-h);
  height: var(--_btn-h);
  border-radius: 999px;
  pointer-events: auto;
  cursor: pointer;
}
.g3d-btn-icon-md::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}
.g3d-btn-icon-md::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}
.g3d-btn-icon-md > svg {
  z-index: 37;
  height: var(--_btn-icon-h);
  width: var(--_btn-icon-h);
  aspect-ratio: 1;
  pointer-events: none;
  will-change: width, height;
  transition: width var(--g3d-speed-base) var(--g3d-smooth-cubic), height var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.g3d-btn-icon-md:hover > svg {
  width: calc(var(--_btn-icon-h) * 1.1);
  height: calc(var(--_btn-icon-h) * 1.1);
}
.g3d-btn-icon-md {
  --btn-h: var(--g3d-ui-h-md);
  --btn-icon-h: calc(var(--btn-h) * 0.55);
}

.g3d-btn-icon-lg {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-icon-h: var(--btn-icon-h, 1rem);
  position: relative;
  z-index: 33;
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--_btn-h);
  height: var(--_btn-h);
  border-radius: 999px;
  pointer-events: auto;
  cursor: pointer;
}
.g3d-btn-icon-lg::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}
.g3d-btn-icon-lg::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
}
.g3d-btn-icon-lg > svg {
  z-index: 37;
  height: var(--_btn-icon-h);
  width: var(--_btn-icon-h);
  aspect-ratio: 1;
  pointer-events: none;
  will-change: width, height;
  transition: width var(--g3d-speed-base) var(--g3d-smooth-cubic), height var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.g3d-btn-icon-lg:hover > svg {
  width: calc(var(--_btn-icon-h) * 1.1);
  height: calc(var(--_btn-icon-h) * 1.1);
}
.g3d-btn-icon-lg {
  --btn-h: var(--g3d-ui-h-lg);
  --btn-icon-h: calc(var(--btn-h) * 0.55);
}

/* ================================================== */
/* Button style */
/* ================================================== */
/* Primary button ✨ Config these values */
/* ================================================== */
/* Secondary button ✨ Config these values */
/* ================================================== */
/* Outline button ✨ Config these values */
/* ================================================== */
/* Ghost button ✨ Config these values */
/* ================================================== */
/* New button template ✨ Config these values */
/* ================================================== */
.my-new-btn {
  --_g3d-btn-text: var(--g3d-btn-text, black);
  --_btn-icon: var(--btn-icon, var(--_g3d-btn-text));
  --_btn-state-bg: var(--btn-state-bg, rgba(36, 156, 3, 0.9));
  --_btn-state-text: var(--btn-state-text, var(--_g3d-btn-text));
  --_btn-state-icon: var(--btn-state-icon, var(--_btn-state-text));
  --_btn-bevel: var(--btn-bevel, none);
  --_btn-blur: var(--btn-blur, 3px);
  --_btn-brightness: var(--btn-brightness, 1);
  --_btn-saturate: var(--btn-saturate, 1.2);
  --_btn-rest: var(--btn-rest, 0.1);
  --_btn-hover: var(--btn-hover, 0.3);
  --_btn-focus: var(--btn-focus, 0.3);
  --_btn-active: var(--btn-active, 0.7);
  --_btn-disabled: var(--btn-disabled, 0.6);
}
.my-new-btn::before {
  will-change: opacity, color;
  transition: opacity var(--g3d-speed-base) var(--g3d-smooth-cubic), color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  background-color: var(--_btn-state-bg);
  opacity: var(--_btn-rest);
}
.my-new-btn::after {
  backdrop-filter: blur(var(--_btn-blur)) brightness(var(--_btn-brightness)) saturate(var(--_btn-saturate));
  box-shadow: var(--_btn-bevel);
}
.my-new-btn > .g3d-btn-text {
  color: var(--_g3d-btn-text);
  will-change: opacity, color;
  transition: opacity var(--g3d-speed-base) var(--g3d-smooth-cubic), color var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.my-new-btn > svg {
  background-color: var(--_btn-icon);
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.my-new-btn:hover > .g3d-btn-text {
  color: var(--_btn-state-text);
}
.my-new-btn:hover > svg {
  background-color: var(--_btn-state-icon);
}
.my-new-btn:hover::before {
  opacity: var(--_btn-hover);
}
.my-new-btn:focus-visible > .g3d-btn-text {
  color: var(--_btn-state-text);
}
.my-new-btn:focus-visible > svg {
  background-color: var(--_btn-state-icon);
}
.my-new-btn:focus-visible::before {
  opacity: var(--_btn-focus);
}
.my-new-btn:focus-visible::after {
  box-shadow: inset 0 0 0 1px hsl(var(--g3d-primary-hs) 50%/0.5), inset 0 0 0 1.5px hsl(var(--g3d-primary-hs) 50%/0.4), inset 0 0 0 2px hsl(var(--g3d-primary-hs) 50%/0.2) !important;
}
.my-new-btn:active > .g3d-btn-text {
  color: var(--_btn-state-text);
}
.my-new-btn:active > svg {
  background-color: var(--_btn-state-icon);
}
.my-new-btn:active::before {
  opacity: var(--_btn-active);
}
.my-new-btn:disabled {
  cursor: not-allowed;
  opacity: var(--_btn-disabled);
  background-color: hsl(var(--g3d-neutral-hs) 10%/0.1);
}
.my-new-btn {
  --g3d-btn-text: black;
  --btn-icon: darkblue;
  --btn-state-bg: black;
  --btn-state-text: white;
  --btn-state-icon: lightblue;
  --btn-bevel: var(--g3d-bevel-md);
  --btn-blur: 8px;
  --btn-brightness: 1;
  --btn-saturate: 1.5;
  --btn-rest: 0.3;
  --btn-hover: 0.6;
  --btn-focus: 0.6;
  --btn-active: 0.9;
  --btn-disabled: 0.6;
}

/* 💠 example */
/* ================================================== */
.g3d-chip-group {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--g3d-3xs);
}

/* Chip structure */
/* ================================================== */
.g3d-chip-xs {
  --_chip-content-h: var(--chip-content-h, 0.8rem);
  --_chip-padding-x: var(--chip-padding-x, 0.8rem);
  --_chip-padding-top: var(--chip-padding-top, 0);
  --_chip-padding-bottom: var(--chip-padding-bottom, 0);
  --_chip-gap: var(--chip-gap, 0.25rem);
  --_chip-radius: var(--chip-radius, 6px);
  width: -moz-fit-content;
  width: fit-content;
  height: var(--g3d-ui-h-xs);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--_chip-gap);
  padding-top: 0; /* added to .g3d-chip-text so svg is not affected */
  padding-right: var(--_chip-padding-x);
  padding-bottom: 0; /* added to .g3d-chip-text so svg is not affected */
  padding-left: var(--_chip-padding-x);
  border-radius: var(--_chip-radius);
  background-color: var(--g3d-inset-bg-xmild);
  box-shadow: var(--g3d-inset-xs);
}
.g3d-chip-xs > .g3d-chip-text {
  pointer-events: none;
  padding-top: var(--_chip-padding-top);
  padding-bottom: var(--_chip-padding-bottom);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--_chip-content-h);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: var(--_chip-content-h);
  color: var(--g3d-text-color-mild);
}
.g3d-chip-xs > svg {
  width: var(--_chip-content-h);
  height: var(--_chip-content-h);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-chip-xs.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_chip-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_chip-padding-x);
}
.g3d-chip-xs.icon-start {
  padding-top: 0;
  padding-right: var(--_chip-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_chip-padding-x) * 0.8);
}

/* ================================================== */
/* Chip */
/* ================================================== */
/* Menu link g3d-marquee */
/* ================================================== */
.g3d-marquee-bin {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: flex;
  justify-content: flex-start;
  padding: 0 var(--g3d-moat) 0 0;
}

.g3d-marquee-bg {
  z-index: var(--g3d-z-surface);
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--g3d-lg) var(--g3d-lg) var(--g3d-lg) var(--g3d-moat);
  border-radius: 0 var(--g3d-sm) var(--g3d-sm) 0;
  box-shadow: var(--g3d-shadow-lg);
}
@media (width >= 48rem) {
  .g3d-marquee-bg {
    padding: var(--g3d-xl) var(--g3d-xl) var(--g3d-xl) var(--g3d-moat);
  }
}
@media screen and (width >= 106rem) {
  .g3d-marquee-bg {
    padding-left: calc((100vw - var(--g3d-general-max-width)) / 2);
  }
}

.g3d-marquee-title-group {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--g3d-3xs);
}
@media (width >= 64rem) {
  .g3d-marquee-title-group {
    gap: var(--g3d-3xs);
  }
}

.g3d-marquee-title {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-min-content;
  height: min-content;
  font-family: var(--g3d-font-display);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-xl);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: 100%;
  text-align: end;
  text-shadow: var(--g3d-text-shadow-sm);
}
@media (width >= 22.5rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-2xl);
  }
}
@media (width >= 30.5rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-3xl);
  }
}
@media (width >= 48rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-4xl);
  }
}
@media (width >= 80rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-5xl);
  }
}
@media (width >= 90rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-6xl);
  }
}

.g3d-marquee-subtitle {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-xs);
  line-height: var(--g3d-line-height-sm);
}
@media (width >= 30.5rem) {
  .g3d-marquee-subtitle {
    font-size: var(--g3d-text-sm);
  }
}
@media (width >= 64rem) {
  .g3d-marquee-subtitle {
    font-size: var(--g3d-text-md);
  }
}

/* ================================================== */
/* Chip */
/* ================================================== */
/* Card + img overlap layout */
/* ================================================== */
/* img-left + card-right overlap */
/* ================================================== */
/* img left layout -> center */
.g3d-img-card-center {
  --visual-w: min(100%, 800px);
  --card-w: min(100%, 450px);
  --overlap: 2rem;
  --offset: 3rem;
  width: 100%;
  max-width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto var(--overlap) auto;
}
.g3d-img-card-center > .g3d-visual-bin {
  width: var(--visual-w);
  height: auto;
  max-height: 500px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  grid-column: 1/2;
  grid-row: 1/3;
  place-self: start center;
}
.g3d-img-card-center > .g3d-card-bin {
  width: var(--card-w);
  grid-column: 1/2;
  grid-row: 2/4;
  place-self: start center;
}
@media (width >= 30.5rem) {
  .g3d-img-card-center {
    grid-template-columns: var(--g3d-moat) 1fr var(--g3d-moat);
  }
  .g3d-img-card-center > .g3d-visual-bin {
    aspect-ratio: 5/4;
    grid-column: 1/4;
    place-self: start center;
  }
  .g3d-img-card-center > .g3d-card-bin {
    grid-column: 2/3;
  }
}
@media (width >= 48rem) {
  .g3d-img-card-center {
    --overlap: 2.5rem;
    max-width: var(--visual-w);
  }
  .g3d-img-card-center > .g3d-visual-bin {
    aspect-ratio: 1/0.6;
  }
}
@media (width >= 64rem) {
  .g3d-img-card-center {
    --overlap: 3rem;
    --offset: 4rem;
  }
}
@media (width >= 80rem) {
  .g3d-img-card-center {
    --overlap: 7rem;
    --card-space: calc(var(--card-w) - var(--overlap));
    --visual-w: min(100%, 700px);
    --offset: 3rem;
    max-width: calc(var(--visual-w) + var(--card-space));
    grid-template-rows: auto var(--offset);
  }
  .g3d-img-card-center > .g3d-visual-bin {
    max-height: 600px;
    aspect-ratio: 5/4;
    grid-row: 1/3;
  }
  .g3d-img-card-center > .g3d-card-bin {
    grid-row: 1/2;
  }
}
@media (width >= 90rem) {
  .g3d-img-card-center {
    --visual-w: min(100%, 800px);
  }
}
@media (width >= 30.5rem) {
  .g3d-img-card-center > .g3d-card-bin {
    place-self: end;
  }
}
@media (width >= 48rem) {
  .g3d-img-card-center {
    grid-template-columns: 1fr var(--offset);
  }
  .g3d-img-card-center > .g3d-visual-bin {
    grid-column: 1/3;
  }
  .g3d-img-card-center > .g3d-card-bin {
    grid-column: 1/2;
  }
}
@media (width >= 80rem) {
  .g3d-img-card-center {
    grid-template-columns: auto var(--overlap) var(--card-space);
  }
  .g3d-img-card-center > .g3d-visual-bin {
    grid-column: 1/3;
  }
  .g3d-img-card-center > .g3d-card-bin {
    grid-column: 2/4;
    place-self: end start;
  }
}
.g3d-img-card-center {
  place-self: start center;
}

/* img left layout -> left */
.g3d-img-card-start {
  --visual-w: min(100%, 800px);
  --card-w: min(100%, 450px);
  --overlap: 2rem;
  --offset: 3rem;
  width: 100%;
  max-width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto var(--overlap) auto;
}
.g3d-img-card-start > .g3d-visual-bin {
  width: var(--visual-w);
  height: auto;
  max-height: 500px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  grid-column: 1/2;
  grid-row: 1/3;
  place-self: start center;
}
.g3d-img-card-start > .g3d-card-bin {
  width: var(--card-w);
  grid-column: 1/2;
  grid-row: 2/4;
  place-self: start center;
}
@media (width >= 30.5rem) {
  .g3d-img-card-start {
    grid-template-columns: var(--g3d-moat) 1fr var(--g3d-moat);
  }
  .g3d-img-card-start > .g3d-visual-bin {
    aspect-ratio: 5/4;
    grid-column: 1/4;
    place-self: start center;
  }
  .g3d-img-card-start > .g3d-card-bin {
    grid-column: 2/3;
  }
}
@media (width >= 48rem) {
  .g3d-img-card-start {
    --overlap: 2.5rem;
    max-width: var(--visual-w);
  }
  .g3d-img-card-start > .g3d-visual-bin {
    aspect-ratio: 1/0.6;
  }
}
@media (width >= 64rem) {
  .g3d-img-card-start {
    --overlap: 3rem;
    --offset: 4rem;
  }
}
@media (width >= 80rem) {
  .g3d-img-card-start {
    --overlap: 7rem;
    --card-space: calc(var(--card-w) - var(--overlap));
    --visual-w: min(100%, 700px);
    --offset: 3rem;
    max-width: calc(var(--visual-w) + var(--card-space));
    grid-template-rows: auto var(--offset);
  }
  .g3d-img-card-start > .g3d-visual-bin {
    max-height: 600px;
    aspect-ratio: 5/4;
    grid-row: 1/3;
  }
  .g3d-img-card-start > .g3d-card-bin {
    grid-row: 1/2;
  }
}
@media (width >= 90rem) {
  .g3d-img-card-start {
    --visual-w: min(100%, 800px);
  }
}
@media (width >= 30.5rem) {
  .g3d-img-card-start > .g3d-card-bin {
    place-self: end;
  }
}
@media (width >= 48rem) {
  .g3d-img-card-start {
    grid-template-columns: 1fr var(--offset);
  }
  .g3d-img-card-start > .g3d-visual-bin {
    grid-column: 1/3;
  }
  .g3d-img-card-start > .g3d-card-bin {
    grid-column: 1/2;
  }
}
@media (width >= 80rem) {
  .g3d-img-card-start {
    grid-template-columns: auto var(--overlap) var(--card-space);
  }
  .g3d-img-card-start > .g3d-visual-bin {
    grid-column: 1/3;
  }
  .g3d-img-card-start > .g3d-card-bin {
    grid-column: 2/4;
    place-self: end start;
  }
}
.g3d-img-card-start {
  place-self: start;
}

/* img left layout -> right */
.g3d-img-card-end {
  --visual-w: min(100%, 800px);
  --card-w: min(100%, 450px);
  --overlap: 2rem;
  --offset: 3rem;
  width: 100%;
  max-width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto var(--overlap) auto;
}
.g3d-img-card-end > .g3d-visual-bin {
  width: var(--visual-w);
  height: auto;
  max-height: 500px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  grid-column: 1/2;
  grid-row: 1/3;
  place-self: start center;
}
.g3d-img-card-end > .g3d-card-bin {
  width: var(--card-w);
  grid-column: 1/2;
  grid-row: 2/4;
  place-self: start center;
}
@media (width >= 30.5rem) {
  .g3d-img-card-end {
    grid-template-columns: var(--g3d-moat) 1fr var(--g3d-moat);
  }
  .g3d-img-card-end > .g3d-visual-bin {
    aspect-ratio: 5/4;
    grid-column: 1/4;
    place-self: start center;
  }
  .g3d-img-card-end > .g3d-card-bin {
    grid-column: 2/3;
  }
}
@media (width >= 48rem) {
  .g3d-img-card-end {
    --overlap: 2.5rem;
    max-width: var(--visual-w);
  }
  .g3d-img-card-end > .g3d-visual-bin {
    aspect-ratio: 1/0.6;
  }
}
@media (width >= 64rem) {
  .g3d-img-card-end {
    --overlap: 3rem;
    --offset: 4rem;
  }
}
@media (width >= 80rem) {
  .g3d-img-card-end {
    --overlap: 7rem;
    --card-space: calc(var(--card-w) - var(--overlap));
    --visual-w: min(100%, 700px);
    --offset: 3rem;
    max-width: calc(var(--visual-w) + var(--card-space));
    grid-template-rows: auto var(--offset);
  }
  .g3d-img-card-end > .g3d-visual-bin {
    max-height: 600px;
    aspect-ratio: 5/4;
    grid-row: 1/3;
  }
  .g3d-img-card-end > .g3d-card-bin {
    grid-row: 1/2;
  }
}
@media (width >= 90rem) {
  .g3d-img-card-end {
    --visual-w: min(100%, 800px);
  }
}
@media (width >= 30.5rem) {
  .g3d-img-card-end > .g3d-card-bin {
    place-self: end;
  }
}
@media (width >= 48rem) {
  .g3d-img-card-end {
    grid-template-columns: 1fr var(--offset);
  }
  .g3d-img-card-end > .g3d-visual-bin {
    grid-column: 1/3;
  }
  .g3d-img-card-end > .g3d-card-bin {
    grid-column: 1/2;
  }
}
@media (width >= 80rem) {
  .g3d-img-card-end {
    grid-template-columns: auto var(--overlap) var(--card-space);
  }
  .g3d-img-card-end > .g3d-visual-bin {
    grid-column: 1/3;
  }
  .g3d-img-card-end > .g3d-card-bin {
    grid-column: 2/4;
    place-self: end start;
  }
}
.g3d-img-card-end {
  place-self: start end;
}

/* card-left + img-right overlap */
/* ================================================== */
/* card-left layout -> center */
.g3d-card-img-center {
  --visual-w: min(100%, 800px);
  --card-w: min(100%, 450px);
  --overlap: 2rem;
  --offset: 3rem;
  width: 100%;
  max-width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto var(--overlap) auto;
}
.g3d-card-img-center > .g3d-visual-bin {
  width: var(--visual-w);
  height: auto;
  max-height: 500px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  grid-column: 1/2;
  grid-row: 1/3;
  place-self: start center;
}
.g3d-card-img-center > .g3d-card-bin {
  width: var(--card-w);
  grid-column: 1/2;
  grid-row: 2/4;
  place-self: start center;
}
@media (width >= 30.5rem) {
  .g3d-card-img-center {
    grid-template-columns: var(--g3d-moat) 1fr var(--g3d-moat);
  }
  .g3d-card-img-center > .g3d-visual-bin {
    aspect-ratio: 5/4;
    grid-column: 1/4;
    place-self: start center;
  }
  .g3d-card-img-center > .g3d-card-bin {
    grid-column: 2/3;
  }
}
@media (width >= 48rem) {
  .g3d-card-img-center {
    --overlap: 2.5rem;
    max-width: var(--visual-w);
  }
  .g3d-card-img-center > .g3d-visual-bin {
    aspect-ratio: 1/0.6;
  }
}
@media (width >= 64rem) {
  .g3d-card-img-center {
    --overlap: 3rem;
    --offset: 4rem;
  }
}
@media (width >= 80rem) {
  .g3d-card-img-center {
    --overlap: 7rem;
    --card-space: calc(var(--card-w) - var(--overlap));
    --visual-w: min(100%, 700px);
    --offset: 3rem;
    max-width: calc(var(--visual-w) + var(--card-space));
    grid-template-rows: auto var(--offset);
  }
  .g3d-card-img-center > .g3d-visual-bin {
    max-height: 600px;
    aspect-ratio: 5/4;
    grid-row: 1/3;
  }
  .g3d-card-img-center > .g3d-card-bin {
    grid-row: 1/2;
  }
}
@media (width >= 90rem) {
  .g3d-card-img-center {
    --visual-w: min(100%, 800px);
  }
}
@media (width >= 30.5rem) {
  .g3d-card-img-center > .g3d-card-bin {
    place-self: start;
  }
}
@media (width >= 48rem) {
  .g3d-card-img-center {
    grid-template-columns: var(--offset) 1fr;
  }
  .g3d-card-img-center > .g3d-card-bin {
    grid-column: 2/3;
  }
  .g3d-card-img-center > .g3d-visual-bin {
    grid-column: 1/3;
  }
}
@media (width >= 80rem) {
  .g3d-card-img-center {
    grid-template-columns: var(--card-space) var(--overlap) auto;
  }
  .g3d-card-img-center > .g3d-card-bin {
    grid-column: 1/3;
    place-self: end;
  }
  .g3d-card-img-center > .g3d-visual-bin {
    grid-column: 2/4;
  }
}
.g3d-card-img-center {
  place-self: start center;
}

/* card-left layout -> left */
.g3d-card-img-start {
  --visual-w: min(100%, 800px);
  --card-w: min(100%, 450px);
  --overlap: 2rem;
  --offset: 3rem;
  width: 100%;
  max-width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto var(--overlap) auto;
}
.g3d-card-img-start > .g3d-visual-bin {
  width: var(--visual-w);
  height: auto;
  max-height: 500px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  grid-column: 1/2;
  grid-row: 1/3;
  place-self: start center;
}
.g3d-card-img-start > .g3d-card-bin {
  width: var(--card-w);
  grid-column: 1/2;
  grid-row: 2/4;
  place-self: start center;
}
@media (width >= 30.5rem) {
  .g3d-card-img-start {
    grid-template-columns: var(--g3d-moat) 1fr var(--g3d-moat);
  }
  .g3d-card-img-start > .g3d-visual-bin {
    aspect-ratio: 5/4;
    grid-column: 1/4;
    place-self: start center;
  }
  .g3d-card-img-start > .g3d-card-bin {
    grid-column: 2/3;
  }
}
@media (width >= 48rem) {
  .g3d-card-img-start {
    --overlap: 2.5rem;
    max-width: var(--visual-w);
  }
  .g3d-card-img-start > .g3d-visual-bin {
    aspect-ratio: 1/0.6;
  }
}
@media (width >= 64rem) {
  .g3d-card-img-start {
    --overlap: 3rem;
    --offset: 4rem;
  }
}
@media (width >= 80rem) {
  .g3d-card-img-start {
    --overlap: 7rem;
    --card-space: calc(var(--card-w) - var(--overlap));
    --visual-w: min(100%, 700px);
    --offset: 3rem;
    max-width: calc(var(--visual-w) + var(--card-space));
    grid-template-rows: auto var(--offset);
  }
  .g3d-card-img-start > .g3d-visual-bin {
    max-height: 600px;
    aspect-ratio: 5/4;
    grid-row: 1/3;
  }
  .g3d-card-img-start > .g3d-card-bin {
    grid-row: 1/2;
  }
}
@media (width >= 90rem) {
  .g3d-card-img-start {
    --visual-w: min(100%, 800px);
  }
}
@media (width >= 30.5rem) {
  .g3d-card-img-start > .g3d-card-bin {
    place-self: start;
  }
}
@media (width >= 48rem) {
  .g3d-card-img-start {
    grid-template-columns: var(--offset) 1fr;
  }
  .g3d-card-img-start > .g3d-card-bin {
    grid-column: 2/3;
  }
  .g3d-card-img-start > .g3d-visual-bin {
    grid-column: 1/3;
  }
}
@media (width >= 80rem) {
  .g3d-card-img-start {
    grid-template-columns: var(--card-space) var(--overlap) auto;
  }
  .g3d-card-img-start > .g3d-card-bin {
    grid-column: 1/3;
    place-self: end;
  }
  .g3d-card-img-start > .g3d-visual-bin {
    grid-column: 2/4;
  }
}
.g3d-card-img-start {
  place-self: start;
}

/* card-left layout -> right */
.g3d-card-img-end {
  --visual-w: min(100%, 800px);
  --card-w: min(100%, 450px);
  --overlap: 2rem;
  --offset: 3rem;
  width: 100%;
  max-width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto var(--overlap) auto;
}
.g3d-card-img-end > .g3d-visual-bin {
  width: var(--visual-w);
  height: auto;
  max-height: 500px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  grid-column: 1/2;
  grid-row: 1/3;
  place-self: start center;
}
.g3d-card-img-end > .g3d-card-bin {
  width: var(--card-w);
  grid-column: 1/2;
  grid-row: 2/4;
  place-self: start center;
}
@media (width >= 30.5rem) {
  .g3d-card-img-end {
    grid-template-columns: var(--g3d-moat) 1fr var(--g3d-moat);
  }
  .g3d-card-img-end > .g3d-visual-bin {
    aspect-ratio: 5/4;
    grid-column: 1/4;
    place-self: start center;
  }
  .g3d-card-img-end > .g3d-card-bin {
    grid-column: 2/3;
  }
}
@media (width >= 48rem) {
  .g3d-card-img-end {
    --overlap: 2.5rem;
    max-width: var(--visual-w);
  }
  .g3d-card-img-end > .g3d-visual-bin {
    aspect-ratio: 1/0.6;
  }
}
@media (width >= 64rem) {
  .g3d-card-img-end {
    --overlap: 3rem;
    --offset: 4rem;
  }
}
@media (width >= 80rem) {
  .g3d-card-img-end {
    --overlap: 7rem;
    --card-space: calc(var(--card-w) - var(--overlap));
    --visual-w: min(100%, 700px);
    --offset: 3rem;
    max-width: calc(var(--visual-w) + var(--card-space));
    grid-template-rows: auto var(--offset);
  }
  .g3d-card-img-end > .g3d-visual-bin {
    max-height: 600px;
    aspect-ratio: 5/4;
    grid-row: 1/3;
  }
  .g3d-card-img-end > .g3d-card-bin {
    grid-row: 1/2;
  }
}
@media (width >= 90rem) {
  .g3d-card-img-end {
    --visual-w: min(100%, 800px);
  }
}
@media (width >= 30.5rem) {
  .g3d-card-img-end > .g3d-card-bin {
    place-self: start;
  }
}
@media (width >= 48rem) {
  .g3d-card-img-end {
    grid-template-columns: var(--offset) 1fr;
  }
  .g3d-card-img-end > .g3d-card-bin {
    grid-column: 2/3;
  }
  .g3d-card-img-end > .g3d-visual-bin {
    grid-column: 1/3;
  }
}
@media (width >= 80rem) {
  .g3d-card-img-end {
    grid-template-columns: var(--card-space) var(--overlap) auto;
  }
  .g3d-card-img-end > .g3d-card-bin {
    grid-column: 1/3;
    place-self: end;
  }
  .g3d-card-img-end > .g3d-visual-bin {
    grid-column: 2/4;
  }
}
.g3d-card-img-end {
  place-self: start end;
}

/* Default styles for customized components */
/* ================================================== */
/* These component styles are commented out because they were copied into and modified 
in the website's SCSS. This prevents these default styles from fighting the custom ones */
/* ================================================== */
/* Aggregate brand tokens */
/* ================================================== */
/* ================================================== */
/* Brand color tokens */
/* ================================================== */
:root {
  /* Primary hue & saturation value */
  --g3d-primary-h: 210;
  --g3d-primary-hs: 210 90%;
  /* Secondary hue & saturation value */
  --g3d-secondary-h: 12;
  --g3d-secondary-hs: 12 75%;
  /* Accent hue & saturation value */
  --g3d-accent-h: 180;
  --g3d-accent-hs: 180 80%;
  /* Neutral hue & saturation value */
  --g3d-neutral-h: 210;
  --g3d-neutral-hs: 210 10%;
  /* Text colors */
  --g3d-text-color-xstrong: hsl(var(--g3d-primary-h) 80% 4% / 1);
  --g3d-text-color-strong: hsl(var(--g3d-primary-h) 50% 7% / 1);
  --g3d-text-color-base: hsl(var(--g3d-primary-h) 20% 15% / 1);
  --g3d-text-color-mild: hsl(var(--g3d-primary-h) 20% 20% / 1);
  --g3d-text-color-xmild: hsl(var(--g3d-primary-h) 15% 30% / 1);
  --g3d-text-color-2xmild: hsl(var(--g3d-primary-h) 10% 40% / 1);
  /* accent colors */
  --g3d-font-color-accent-xstrong: hsl(var(--g3d-accent-h) 99% 35% / 1);
  --g3d-font-color-accent-strong: hsl(var(--g3d-accent-h) 95% 30% / 1);
  --g3d-font-color-accent-base: hsl(var(--g3d-accent-h) 99% 25% / 1);
  /* Surface colors */
  /* ================================================== */
  --g3d-bg-color-xstrong: hsl(var(--g3d-neutral-hs) 98% / 1);
  --g3d-bg-color-strong: hsl(var(--g3d-neutral-hs) 95% / 1);
  --g3d-bg-color-base: hsl(var(--g3d-neutral-hs) 93% / 1);
  --g3d-bg-color-mild: hsl(var(--g3d-neutral-hs) 90% / 1);
  --g3d-bg-color-xmild: hsl(var(--g3d-neutral-hs) 85% / 1);
  /* Inset bg colors */
  --g3d-inset-bg-strong: hsl(var(--g3d-neutral-hs) 10% / 0.4);
  --g3d-inset-bg-base: hsl(var(--g3d-neutral-hs) 10% / 0.3);
  --g3d-inset-bg-mild: hsl(var(--g3d-neutral-hs) 10% / 0.2);
  --g3d-inset-bg-xmild: hsl(var(--g3d-neutral-hs) 10% / 0.1);
  --g3d-highlight-color: hsl(var(--g3d-primary-hs) 70% / 0.6);
  /* Raw HSL colors */
  /* ================================================== */
  --g3d-shadow: 235 40% 10%;
  --g3d-highlight: 203 80% 98%;
  /* ================================================== */
  /* Inverse colors */
  /* ================================================== */
  --g3d-font-color-inverse-accent: hsl(var(--g3d-accent-h) 70% 50% / 1);
  --g3d-font-color-inverse-xstrong: hsl(var(--g3d-secondary-h) 45% 75% / 1);
  --g3d-font-color-inverse-strong: hsl(var(--g3d-primary-h) 50% 85% / 1);
  --g3d-font-color-inverse-base: hsl(var(--g3d-secondary-h) 30% 80% / 1);
  --g3d-font-color-inverse-mild: hsl(var(--g3d-primary-h) 30% 70% / 1);
  --g3d-font-color-inverse-xmild: hsl(var(--g3d-primary-h) 20% 65% / 1);
  /* ================================================== */
  /* Semantic color values */
  /* ================================================== */
  /* Main Nav */
  --g3d-nav-link-text-color: hsl(var(--g3d-primary-h) 60% 30% / 1);
  --g3d-nav-link-text-color-hover: hsl(var(--g3d-primary-h) 70% 60% / 1);
  --g3d-dropdown-item-bg: hsl(var(--g3d-primary-hs) 95% / 0.1);
  --g3d-dropdown-item-bg-hover: hsl(var(--g3d-primary-hs) 95% / 0.5);
  --g3d-dropdown-item-text-color: hsl(var(--g3d-secondary-h) 90% 25% / 1);
  --g3d-dropdown-item-text-color-hover: hsl(var(--g3d-secondary-h) 70% 50% / 1);
  /* Footer */
  --g3d-footer-link-color: hsl(var(--g3d-accent-h) 80% 45% / 1);
  --g3d-footer-link-color-hover: hsl(var(--g3d-primary-h) 70% 80% / 1);
  --g3d-footer-link-color-visited: hsl(var(--g3d-secondary-h) 40% 60% / 1);
  --g3d-footer-bg-color: hsl(var(--g3d-primary-h) 97% 7% / 1);
  --g3d-footer-divider-color: hsl(var(--g3d-primary-hs) 95% / 0.1);
}

/* ================================================== */
/* Brand spacing */
/* ================================================== */
/* Aggregate SCSS abstracts */
/* ================================================== */
/** Forwards all style and component logic from the full glass3d design system.
* 
* Includes:
* mixins
* functions
* variables
* maps/lists
*/
/* Styles */
/* ================================================== */
/* ================================================== */
/* Forward all components */
/* ================================================== */
/* ================================================== */
:root {
  --g3d-5xs: 0.125rem;
  --g3d-4xs: 0.25rem;
  --g3d-3xs: 0.5rem;
  --g3d-2xs: 0.75rem;
  --g3d-xs: 0.875rem;
  --g3d-sm: 1rem;
  --g3d-md: 1.25rem;
  --g3d-lg: 1.5rem;
  --g3d-xl: 2rem;
  --g3d-2xl: 2.5rem;
  --g3d-3xl: 3rem;
  --g3d-4xl: 4rem;
  --g3d-5xl: 5rem;
  --g3d-6xl: 6rem;
  --g3d-7xl: 7rem;
  --g3d-8xl: 8rem;
}

:root {
  --g3d-general-max-width: 90rem;
  --g3d-jumbo-max-width: 140rem;
  --g3d-moat-xs: 1.1rem;
  --g3d-moat-sm: 1.2rem;
  --g3d-moat-md: 2rem;
  --g3d-moat-lg: 2.5rem;
  --g3d-moat-xl: 6rem;
  --g3d-moat-2xl: 8rem;
}

/* Used for main layout max width e.g. nav and footer */
.g3d-general-max-w {
  max-width: min(100%, var(--g3d-general-max-width));
}

/* Used for super wide elements that break outside the layout */
.g3d-jumbo-max-w {
  max-width: min(100%, var(--g3d-jumbo-max-width));
}

.g3d-spacing-roomy {
  --space-roomy: 8rem;
  --space-roomy-half: calc(var(--space-roomy) / 2);
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--space-roomy);
  padding-top: var(--space-roomy-half);
  padding-bottom: var(--space-roomy-half);
}
@media (width >= 30.5rem) {
  .g3d-spacing-roomy {
    --space-roomy: 10rem;
  }
}
@media (width >= 48rem) {
  .g3d-spacing-roomy {
    --space-roomy: 12rem;
  }
}
@media (width >= 64rem) {
  .g3d-spacing-roomy {
    --space-roomy: 14rem;
  }
}
@media (width >= 80rem) {
  .g3d-spacing-roomy {
    --space-roomy: 16rem;
  }
}
@media (width >= 90rem) {
  .g3d-spacing-roomy {
    --space-roomy: 18rem;
  }
}
@media (width >= 120rem) {
  .g3d-spacing-roomy {
    --space-roomy: 20rem;
  }
}

.g3d-spacing-compact {
  --space-compact: 4rem;
  --space-compact-half: calc(var(--space-compact) / 2);
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--space-compact);
  padding-top: var(--space-compact-half);
  padding-bottom: var(--space-compact-half);
}
@media (width >= 30.5rem) {
  .g3d-spacing-compact {
    --space-compact: 5rem;
  }
}
@media (width >= 48rem) {
  .g3d-spacing-compact {
    --space-compact: 6rem;
  }
}
@media (width >= 64rem) {
  .g3d-spacing-compact {
    --space-compact: 7rem;
  }
}
@media (width >= 80rem) {
  .g3d-spacing-compact {
    --space-compact: 8rem;
  }
}
@media (width >= 90rem) {
  .g3d-spacing-compact {
    --space-compact: 9rem;
  }
}
@media (width >= 120rem) {
  .g3d-spacing-compact {
    --space-compact: 10rem;
  }
}

/* ================================================== */
/* Fonts */
/* ================================================== */
/* Credit: Mario Ranftl for Google Webfonts Helper */
/* https://gwfh.mranftl.com/fonts */
/* Satoshi-variable */
/* ================================================== */
@font-face {
  font-family: "Satoshi-Variable";
  src: url("/fonts/Satoshi-Variable.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
/* Lumierepolis */
/* ================================================== */
@font-face {
  font-family: "lumierepolis";
  src: url("/fonts/lumierepolis/LumierepolisLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "lumierepolis";
  src: url("/fonts/lumierepolis/Lumierepolis.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "lumierepolis";
  src: url("/fonts/lumierepolis/LumierepolisBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
/* Modeco */
/* ================================================== */
/** Font Credit
* http://ekobimantara.com/
* ekobimantarafonts@gmail.com
*/
@font-face {
  font-family: "modeco";
  src: url("/fonts/modeco/ModecoTrial-Regular.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
}
@font-face {
  font-family: "modeco";
  src: url("/fonts/modeco/ModecoTrial-ExtraLight.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-weight: 300;
}
@font-face {
  font-family: "modeco";
  src: url("/fonts/modeco/ModecoTrial-Bold.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-weight: 500;
}
/* Safira-March */
/* ================================================== */
@font-face {
  font-family: "safira-march";
  src: url("/fonts/safira_march/Safira-March.woff2") format("woff2"), url("/fonts/safira_march/Safira-March.woff") format("woff"), url("/fonts/safira_march/Safira-March.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
/* Velista */
/* ================================================== */
@font-face {
  font-family: "velista";
  src: url("/fonts/VELISTA.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
/* Roobert */
/* ================================================== */
@font-face {
  font-family: "roobert";
  src: url("/fonts/Roobert/Roobert-Light.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-weight: 300;
}
@font-face {
  font-family: "roobert";
  src: url("/fonts/Roobert/Roobert-Regular.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
}
@font-face {
  font-family: "roobert";
  src: url("/fonts/Roobert/Roobert-Medium.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-weight: 500;
}
@font-face {
  font-family: "roobert";
  src: url("/fonts/Roobert/Roobert-SemiBold.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-weight: 600;
}
@font-face {
  font-family: "roobert";
  src: url("/fonts/Roobert/Roobert-Bold.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  font-weight: 700;
}
/* Lexend */
/* ================================================== */
/* lexend-100 - latin */
@font-face {
  font-display: swap;
  font-family: "Lexend";
  font-style: normal;
  font-weight: 100;
  src: url("/fonts/lexend/lexend-v25-latin-100.woff2") format("woff2");
}
/* lexend-200 - latin */
@font-face {
  font-display: swap;
  font-family: "Lexend";
  font-style: normal;
  font-weight: 200;
  src: url("/fonts/lexend/lexend-v25-latin-200.woff2") format("woff2");
}
/* lexend-300 - latin */
@font-face {
  font-display: swap;
  font-family: "Lexend";
  font-style: normal;
  font-weight: 300;
  src: url("/fonts/lexend/lexend-v25-latin-300.woff2") format("woff2");
}
/* lexend-regular - latin */
@font-face {
  font-display: swap;
  font-family: "Lexend";
  font-style: normal;
  font-weight: 400;
  src: url("/fonts/lexend/lexend-v25-latin-regular.woff2") format("woff2");
}
/* lexend-500 - latin */
@font-face {
  font-display: swap;
  font-family: "Lexend";
  font-style: normal;
  font-weight: 500;
  src: url("/fonts/lexend/lexend-v25-latin-500.woff2") format("woff2");
}
/* lexend-600 - latin */
@font-face {
  font-display: swap;
  font-family: "Lexend";
  font-style: normal;
  font-weight: 600;
  src: url("/fonts/lexend/lexend-v25-latin-600.woff2") format("woff2");
}
/* lexend-700 - latin */
@font-face {
  font-display: swap;
  font-family: "Lexend";
  font-style: normal;
  font-weight: 700;
  src: url("/fonts/lexend/lexend-v25-latin-700.woff2") format("woff2");
}
/* ================================================== */
/* Brand spacing */
/* ================================================== */
/* Brand Typography */
/* ================================================== */
:root {
  /* Font family */
  /* ================================================== */
  --g3d-font-display: "lumierepolis", "Arial", system-ui, sans-serif;
  --g3d-font-title: "Satoshi-Variable", "Arial", system-ui, sans-serif;
  --g3d-font-body: "Satoshi-Variable", "Arial", system-ui, sans-serif;
  /* font-weight: */
  /* Lexend 100 to 700 */
  /* Velista only has 1 weight */
  /* ================================================== */
  --g3d-font-weight-2xs: 100;
  --g3d-font-weight-xs: 200;
  --g3d-font-weight-sm: 300;
  --g3d-font-weight-md: 400;
  --g3d-font-weight-lg: 500;
  --g3d-font-weight-xl: 600;
  --g3d-font-weight-2xl: 700;
  /* font-size: */
  /* ================================================== */
  --g3d-text-3xs: 0.625rem;
  --g3d-text-2xs: 0.75rem;
  --g3d-text-xs: 0.875rem;
  --g3d-text-sm: 1rem;
  --g3d-text-md: 1.125rem;
  --g3d-text-lg: 1.25rem;
  --g3d-text-xl: 1.5rem;
  --g3d-text-2xl: 1.75rem;
  --g3d-text-3xl: 2rem;
  --g3d-text-4xl: 2.5rem;
  --g3d-text-5xl: 3rem;
  --g3d-text-6xl: 3.5rem;
  --g3d-text-7xl: 4rem;
  --g3d-text-8xl: 5rem;
  --g3d-text-9xl: 6rem;
  /* letter-spacing: */
  /* ================================================== */
  --g3d-letter-spacing-2xs: -0.01em;
  --g3d-letter-spacing-xs: -0.005em;
  --g3d-letter-spacing-sm: 0.01em;
  --g3d-letter-spacing-md: 0.02em;
  --g3d-letter-spacing-lg: 0.04em;
  --g3d-letter-spacing-xl: 0.16em;
  --g3d-letter-spacing-2xl: min(0.8vw, 8px);
  /* line-height: */
  /* ================================================== */
  --g3d-line-height-3xs: calc(0.125em + 1.4ex + 0.125em);
  --g3d-line-height-2xs: calc(0.125em + 1.6ex + 0.125em);
  --g3d-line-height-xs: calc(0.125em + 1.8ex + 0.125em);
  --g3d-line-height-sm: calc(0.125em + 2ex + 0.125em);
  --g3d-line-height-md: calc(0.125em + 2.1ex + 0.125em);
  --g3d-line-height-lg: calc(0.125em + 2.5ex + 0.125em);
}

/* Text size MAP */
/* ================================================== */
/* Generate text size classes */
.g3d-font-size-3xs {
  font-size: var(--g3d-text-3xs);
}
.g3d-font-size-2xs {
  font-size: var(--g3d-text-2xs);
}
.g3d-font-size-xs {
  font-size: var(--g3d-text-xs);
}
.g3d-font-size-sm {
  font-size: var(--g3d-text-sm);
}
.g3d-font-size-md {
  font-size: var(--g3d-text-md);
}
.g3d-font-size-lg {
  font-size: var(--g3d-text-lg);
}
.g3d-font-size-xl {
  font-size: var(--g3d-text-xl);
}
.g3d-font-size-2xl {
  font-size: var(--g3d-text-2xl);
}
.g3d-font-size-3xl {
  font-size: var(--g3d-text-3xl);
}
.g3d-font-size-4xl {
  font-size: var(--g3d-text-4xl);
}
.g3d-font-size-5xl {
  font-size: var(--g3d-text-5xl);
}
.g3d-font-size-6xl {
  font-size: var(--g3d-text-6xl);
}
.g3d-font-size-7xl {
  font-size: var(--g3d-text-7xl);
}
.g3d-font-size-8xl {
  font-size: var(--g3d-text-8xl);
}
.g3d-font-size-9xl {
  font-size: var(--g3d-text-9xl);
}

/* ================================================== */
/* Brand spacing */
/* ================================================== */
/* Brand font styles */
/* ================================================== */
.g3d-font-style-body {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-2xs);
}

.g3d-font-style-tiny {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-2xs);
}

/* Font colors */
/* ================================================== */
.g3d-font-color-inverse-xstrong {
  color: var(--g3d-font-color-inverse-xstrong);
}

.g3d-font-color-inverse-strong {
  color: var(--g3d-font-color-inverse-strong);
}

.g3d-font-color-inverse-base {
  color: var(--g3d-font-color-inverse-base);
}

.g3d-font-color-inverse-mild {
  color: var(--g3d-font-color-inverse-mild);
}

.g3d-font-color-inverse-xmild {
  color: var(--g3d-font-color-inverse-xmild);
}

/* ================================================== */
/* Proto materials */
/* ================================================== */
/* ================================================== */
/* Bevels */
/* ================================================== */
:root {
  --g3d-bevel-none: none;
  --g3d-bevel-2xl:
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.8),
    inset -4px 4px 2px -6px hsl(var(--g3d-highlight) / 0.5),
    inset -1.5px 1.5px 0.5px hsl(var(--g3d-highlight) / 0.08),
    inset -0.5px 0.5px 1px 0.5px hsl(var(--g3d-highlight) / 0.1),
    inset -1.25px 1.25px hsl(var(--g3d-highlight) / 0.05),
    inset 1.5px -1.5px 1.5px hsl(var(--g3d-shadow) / 0.15),
    inset 1px -1px 1px hsl(var(--g3d-shadow) / 0.1);
  --g3d-bevel-3xl:
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.8),
    inset -4px 4px 2px -6px hsl(var(--g3d-highlight) / 0.7),
    inset -1.5px 1.5px 1.2px -0.5px hsl(var(--g3d-highlight) / 0.15),
    inset -1.5px 1.5px 1.25px 0px hsl(var(--g3d-highlight) / 0.15),
    inset -2px 2px 0.25px hsl(var(--g3d-highlight) / 0.15),
    inset 2px -2px 0.5px hsl(var(--g3d-shadow) / 0.05),
    inset 1.5px -1.5px 0.25px hsl(var(--g3d-shadow) / 0.08);
  /* e2e bevels */
  /* ================================================== */
  --g3d-e2e-bevel-2xl:
    inset 0 2px 0.5px -0.5px hsl(var(--g3d-highlight) / 0.08),
    inset 0 2px 1px -1px hsl(var(--g3d-highlight) / 0.1),
    inset 0 1.25px hsl(var(--g3d-highlight) / 0.05),
    inset 0 -3px 1.5px -1.5px hsl(var(--g3d-shadow) / 0.15),
    inset 0 -2px 1px -1px hsl(var(--g3d-shadow) / 0.1);
}

/* Bevel classes */
/* ================================================== */
.g3d-bevel-none {
  box-shadow: var(--g3d-bevel-none);
}

.g3d-bevel-2xl {
  box-shadow: var(--g3d-bevel-2xl);
}

.g3d-e2e-bevel-2xl {
  box-shadow: var(--g3d-e2e-bevel-2xl);
}

:root {
  --g3d-texture-egg-shell: url("/textures/egg-shell.png");
}

/* ================================================== */
/* Brand spacing */
/* ================================================== */
/* Brand Materials */
/* ================================================== */
/* Glass base 3D */
/* ================================================== */
.g3d-glass-base-3d {
  --_g3d-glass-z: var(--g3d-glass-z, 1);
  /* Background color HSL */
  --_g3d-glass-h: var(--g3d-glass-h, 203);
  --_g3d-glass-s: var(--g3d-glass-s, 70%);
  --_g3d-glass-l: var(--g3d-glass-l, 50%);
  --_g3d-glass-a: var(--g3d-glass-a, 0.1);
  /* Backdrop filter */
  --_g3d-glass-blur: var(--g3d-glass-blur, 16px);
  --_g3d-glass-saturate: var(--g3d-glass-saturate, 1.5);
  --_g3d-glass-brightness: var(--g3d-glass-brightness, 1.1);
  /* Glass texture */
  --_g3d-glass-texture-img: var(
    --g3d-glass-texture-img,
    var(--g3d-texture-egg-shell)
  );
  --_g3d-glass-texture-size: var(
    --g3d-glass-texture-size,
    var(--g3d-texture-lg)
  );
  /* Glass bevel */
  --_g3d-glass-bevel: var(--g3d-glass-bevel, var(--g3d-bevel-2xl));
  position: relative;
  z-index: var(--_g3d-glass-z);
  isolation: isolate;
}
.g3d-glass-base-3d::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) - 1);
  backdrop-filter: blur(var(--_g3d-glass-blur)) brightness(var(--_g3d-glass-brightness)) saturate(var(--_g3d-glass-saturate));
  background-color: hsl(var(--_g3d-glass-h), var(--_g3d-glass-s), var(--_g3d-glass-l), max(var(--_g3d-glass-a), 0.01));
  background-image: var(--_g3d-glass-texture-img);
  background-size: var(--_g3d-glass-texture-size);
  background-repeat: repeat;
}
.g3d-glass-base-3d::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) + 1);
  box-shadow: var(--_g3d-glass-bevel);
}
.g3d-glass-base-3d > * {
  position: relative;
  z-index: calc(var(--_g3d-glass-z, 1) + 3);
}
.g3d-glass-base-3d {
  --g3d-glass-z: 1;
  /* Background color HSL */
  --g3d-glass-h: var(--g3d-secondary-h);
  --g3d-glass-s: 90%;
  --g3d-glass-l: 95%;
  --g3d-glass-a: 0.25;
  /* Backdrop filter */
  --g3d-glass-blur: 18px;
  --g3d-glass-saturate: 1.5;
  --g3d-glass-brightness: 1.05;
  /* Glass texture */
  --g3d-glass-texture-img: var(--g3d-texture-egg-shell);
  --g3d-glass-texture-size: var(--g3d-texture-lg);
  /* Glass bevel */
}
.g3d-glass-base-3d::after {
  box-shadow: var(--g3d-bevel-2xl);
}

/* e2e */
/* ================================================== */
.g3d-glass-base-e2e {
  --_g3d-glass-z: var(--g3d-glass-z, 1);
  /* Background color HSL */
  --_g3d-glass-h: var(--g3d-glass-h, 203);
  --_g3d-glass-s: var(--g3d-glass-s, 70%);
  --_g3d-glass-l: var(--g3d-glass-l, 50%);
  --_g3d-glass-a: var(--g3d-glass-a, 0.1);
  /* Backdrop filter */
  --_g3d-glass-blur: var(--g3d-glass-blur, 16px);
  --_g3d-glass-saturate: var(--g3d-glass-saturate, 1.5);
  --_g3d-glass-brightness: var(--g3d-glass-brightness, 1.1);
  /* Glass texture */
  --_g3d-glass-texture-img: var(
    --g3d-glass-texture-img,
    var(--g3d-texture-egg-shell)
  );
  --_g3d-glass-texture-size: var(
    --g3d-glass-texture-size,
    var(--g3d-texture-lg)
  );
  /* Glass bevel */
  --_g3d-glass-bevel: var(--g3d-glass-bevel, var(--g3d-bevel-2xl));
  position: relative;
  z-index: var(--_g3d-glass-z);
  isolation: isolate;
}
.g3d-glass-base-e2e::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) - 1);
  backdrop-filter: blur(var(--_g3d-glass-blur)) brightness(var(--_g3d-glass-brightness)) saturate(var(--_g3d-glass-saturate));
  background-color: hsl(var(--_g3d-glass-h), var(--_g3d-glass-s), var(--_g3d-glass-l), max(var(--_g3d-glass-a), 0.01));
  background-image: var(--_g3d-glass-texture-img);
  background-size: var(--_g3d-glass-texture-size);
  background-repeat: repeat;
}
.g3d-glass-base-e2e::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) + 1);
  box-shadow: var(--_g3d-glass-bevel);
}
.g3d-glass-base-e2e > * {
  position: relative;
  z-index: calc(var(--_g3d-glass-z, 1) + 3);
}
.g3d-glass-base-e2e {
  --g3d-glass-z: 1;
  /* Background color HSL */
  --g3d-glass-h: var(--g3d-secondary-h);
  --g3d-glass-s: 90%;
  --g3d-glass-l: 95%;
  --g3d-glass-a: 0.25;
  /* Backdrop filter */
  --g3d-glass-blur: 18px;
  --g3d-glass-saturate: 1.5;
  --g3d-glass-brightness: 1.05;
  /* Glass texture */
  --g3d-glass-texture-img: var(--g3d-texture-egg-shell);
  --g3d-glass-texture-size: var(--g3d-texture-lg);
  /* Glass bevel */
}
.g3d-glass-base-e2e::after {
  box-shadow: var(--g3d-e2e-bevel-2xl);
}

/* 2D */
/* ================================================== */
.g3d-glass-base-2d {
  --_g3d-glass-z: var(--g3d-glass-z, 1);
  /* Background color HSL */
  --_g3d-glass-h: var(--g3d-glass-h, 203);
  --_g3d-glass-s: var(--g3d-glass-s, 70%);
  --_g3d-glass-l: var(--g3d-glass-l, 50%);
  --_g3d-glass-a: var(--g3d-glass-a, 0.1);
  /* Backdrop filter */
  --_g3d-glass-blur: var(--g3d-glass-blur, 16px);
  --_g3d-glass-saturate: var(--g3d-glass-saturate, 1.5);
  --_g3d-glass-brightness: var(--g3d-glass-brightness, 1.1);
  /* Glass texture */
  --_g3d-glass-texture-img: var(
    --g3d-glass-texture-img,
    var(--g3d-texture-egg-shell)
  );
  --_g3d-glass-texture-size: var(
    --g3d-glass-texture-size,
    var(--g3d-texture-lg)
  );
  /* Glass bevel */
  --_g3d-glass-bevel: var(--g3d-glass-bevel, var(--g3d-bevel-2xl));
  position: relative;
  z-index: var(--_g3d-glass-z);
  isolation: isolate;
}
.g3d-glass-base-2d::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) - 1);
  backdrop-filter: blur(var(--_g3d-glass-blur)) brightness(var(--_g3d-glass-brightness)) saturate(var(--_g3d-glass-saturate));
  background-color: hsl(var(--_g3d-glass-h), var(--_g3d-glass-s), var(--_g3d-glass-l), max(var(--_g3d-glass-a), 0.01));
  background-image: var(--_g3d-glass-texture-img);
  background-size: var(--_g3d-glass-texture-size);
  background-repeat: repeat;
}
.g3d-glass-base-2d::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) + 1);
  box-shadow: var(--_g3d-glass-bevel);
}
.g3d-glass-base-2d > * {
  position: relative;
  z-index: calc(var(--_g3d-glass-z, 1) + 3);
}
.g3d-glass-base-2d {
  --g3d-glass-z: 1;
  /* Background color HSL */
  --g3d-glass-h: var(--g3d-secondary-h);
  --g3d-glass-s: 90%;
  --g3d-glass-l: 95%;
  --g3d-glass-a: 0.25;
  /* Backdrop filter */
  --g3d-glass-blur: 18px;
  --g3d-glass-saturate: 1.5;
  --g3d-glass-brightness: 1.05;
  /* Glass texture */
  --g3d-glass-texture-img: var(--g3d-texture-egg-shell);
  --g3d-glass-texture-size: var(--g3d-texture-lg);
  /* Glass bevel */
}
.g3d-glass-base-2d::after {
  box-shadow: var(--g3d-bevel-none);
}

/* ================================================== */
/* Glass tints */
/* ================================================== */
.tint-emerald {
  --g3d-glass-h: 160;
  --g3d-glass-s: 70%;
  --g3d-glass-l: 45%;
  --g3d-glass-a: 0.5;
}

.tint-rose {
  --g3d-glass-h: 350;
  --g3d-glass-s: 75%;
  --g3d-glass-l: 55%;
  --g3d-glass-a: 0.5;
}

/* ================================================== */
/* Brand spacing */
/* ================================================== */
/* Button styles */
/* ================================================== */
/* Gradients */
/* ================================================== */
:root {
  --_g3d-glass-gradient-highlight: var(
    --g3d-glass-gradient-highlight,
    var(--g3d-primary-h) 70% 98%
  );
  --_g3d-glass-gradient-midtone: var(
    --g3d-glass-gradient-midtone,
    var(--g3d-primary-h) 40% 90%
  );
  --_g3d-glass-gradient-shadow: var(
    --g3d-glass-gradient-shadow,
    var(--g3d-primary-h) 30% 70%
  );
  --_g3d-glass-gradient-opacity: var(--g3d-glass-gradient-opacity, 0.95);
  --g3d-glass-gradient-base: linear-gradient(
    45deg,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      0%,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      10%,
    hsla(
        var(--_g3d-glass-gradient-midtone) / var(--_g3d-glass-gradient-opacity)
      )
      70%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      90%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      100%
  );
}

.g3d-glass-gradient-light {
  background: var(--g3d-glass-gradient-base);
}

.g3d-glass-gradient-dark {
  --g3d-glass-gradient-highlight: var(--g3d-primary-h) 70% 95%;
  --g3d-glass-gradient-midtone: var(--g3d-primary-h) 30% 80%;
  --g3d-glass-gradient-shadow: var(--g3d-primary-h) 20% 6%;
  --g3d-glass-gradient-opacity: 0.5;
  background: linear-gradient(45deg, hsla(var(--g3d-glass-gradient-shadow)/var(--g3d-glass-gradient-opacity)) 0%, hsla(var(--g3d-glass-gradient-shadow)/var(--g3d-glass-gradient-opacity)) 10%, hsla(var(--g3d-glass-gradient-midtone)/var(--g3d-glass-gradient-opacity)) 70%, hsla(var(--g3d-glass-gradient-highlight)/var(--g3d-glass-gradient-opacity)) 90%, hsla(var(--g3d-glass-gradient-highlight)/var(--g3d-glass-gradient-opacity)) 100%);
}

/* ================================================== */
/* Brand spacing */
/* ================================================== */
/* Button styles */
/* ================================================== */
/* Brand paper */
/* ================================================== */
:root {
  --g3d-texture-paper2: url("https://www.transparenttextures.com/patterns/paper-2.png");
  --g3d-texture-paper3: url("https://www.transparenttextures.com/patterns/paper.png");
  --g3d-texture-paper4: url("https://www.transparenttextures.com/patterns/cream-paper.png");
  --g3d-texture-paper5: url("https://www.transparenttextures.com/patterns/cardboard.png");
  --g3d-texture-paper6: url("https://www.transparenttextures.com/patterns/beige-paper.png");
  --g3d-texture-paper7: url("https://www.transparenttextures.com/patterns/rice-paper-2.png");
  --g3d-texture-sm: 25px;
  --g3d-texture-md: 40px;
  --g3d-texture-lg: 100px;
  --g3d-paper-z: 70;
  --g3d-paper-color: hsl(var(--g3d-primary-h) 50% 5% / 0.5);
  --g3d-paper-texture-img: var(--g3d-texture-paper3);
  --g3d-paper-texture-size: var(--g3d-texture-lg);
  --g3d-paper-shadow: var(--g3d-paper-shadow-sm);
}

.g3d-paper-2xs {
  --g3d-paper-shadow: var(--g3d-paper-shadow-2xs);
  --_g3d-paper-color: var(
    --g3d-paper-color,
    hsl(var(--g3d-primary-h) 20% 50% / 1)
  );
}
.g3d-paper-2xs::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  --_g3d-glass-gradient-highlight: var(
    --g3d-glass-gradient-highlight,
    var(--g3d-primary-h) 70% 98%
  );
  --_g3d-glass-gradient-midtone: var(
    --g3d-glass-gradient-midtone,
    var(--g3d-primary-h) 40% 90%
  );
  --_g3d-glass-gradient-shadow: var(
    --g3d-glass-gradient-shadow,
    var(--g3d-primary-h) 30% 70%
  );
  --_g3d-glass-gradient-opacity: var(--g3d-glass-gradient-opacity, 0.7);
  --g3d-glass-gradient-base: linear-gradient(
    45deg,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      0%,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      10%,
    hsla(
        var(--_g3d-glass-gradient-midtone) / var(--_g3d-glass-gradient-opacity)
      )
      70%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      90%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      100%
  );
  z-index: calc(var(--g3d-paper-z) - 1);
  background: var(--g3d-glass-gradient-base);
  background-color: var(--_g3d-paper-color);
}
.g3d-paper-2xs {
  position: relative;
  z-index: var(--g3d-paper-z);
}
.g3d-paper-2xs::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--g3d-paper-z, 1) + 1);
  background-image: var(--g3d-paper-texture-img);
  background-size: var(--g3d-paper-texture-size);
  background-repeat: repeat;
  mix-blend-mode: multiply;
}
.g3d-paper-2xs > * {
  position: relative;
  z-index: calc(var(--g3d-paper-z, 1) + 3);
}

.g3d-paper-xs {
  --g3d-paper-shadow: var(--g3d-paper-shadow-xs);
  --_g3d-paper-color: var(
    --g3d-paper-color,
    hsl(var(--g3d-primary-h) 20% 50% / 1)
  );
}
.g3d-paper-xs::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  --_g3d-glass-gradient-highlight: var(
    --g3d-glass-gradient-highlight,
    var(--g3d-primary-h) 70% 98%
  );
  --_g3d-glass-gradient-midtone: var(
    --g3d-glass-gradient-midtone,
    var(--g3d-primary-h) 40% 90%
  );
  --_g3d-glass-gradient-shadow: var(
    --g3d-glass-gradient-shadow,
    var(--g3d-primary-h) 30% 70%
  );
  --_g3d-glass-gradient-opacity: var(--g3d-glass-gradient-opacity, 0.7);
  --g3d-glass-gradient-base: linear-gradient(
    45deg,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      0%,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      10%,
    hsla(
        var(--_g3d-glass-gradient-midtone) / var(--_g3d-glass-gradient-opacity)
      )
      70%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      90%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      100%
  );
  z-index: calc(var(--g3d-paper-z) - 1);
  background: var(--g3d-glass-gradient-base);
  background-color: var(--_g3d-paper-color);
}
.g3d-paper-xs {
  position: relative;
  z-index: var(--g3d-paper-z);
}
.g3d-paper-xs::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--g3d-paper-z, 1) + 1);
  background-image: var(--g3d-paper-texture-img);
  background-size: var(--g3d-paper-texture-size);
  background-repeat: repeat;
  mix-blend-mode: multiply;
}
.g3d-paper-xs > * {
  position: relative;
  z-index: calc(var(--g3d-paper-z, 1) + 3);
}

.g3d-paper-sm {
  --g3d-paper-shadow: var(--g3d-paper-shadow-sm);
  --_g3d-paper-color: var(
    --g3d-paper-color,
    hsl(var(--g3d-primary-h) 20% 50% / 1)
  );
}
.g3d-paper-sm::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  --_g3d-glass-gradient-highlight: var(
    --g3d-glass-gradient-highlight,
    var(--g3d-primary-h) 70% 98%
  );
  --_g3d-glass-gradient-midtone: var(
    --g3d-glass-gradient-midtone,
    var(--g3d-primary-h) 40% 90%
  );
  --_g3d-glass-gradient-shadow: var(
    --g3d-glass-gradient-shadow,
    var(--g3d-primary-h) 30% 70%
  );
  --_g3d-glass-gradient-opacity: var(--g3d-glass-gradient-opacity, 0.7);
  --g3d-glass-gradient-base: linear-gradient(
    45deg,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      0%,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      10%,
    hsla(
        var(--_g3d-glass-gradient-midtone) / var(--_g3d-glass-gradient-opacity)
      )
      70%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      90%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      100%
  );
  z-index: calc(var(--g3d-paper-z) - 1);
  background: var(--g3d-glass-gradient-base);
  background-color: var(--_g3d-paper-color);
}
.g3d-paper-sm {
  position: relative;
  z-index: var(--g3d-paper-z);
}
.g3d-paper-sm::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--g3d-paper-z, 1) + 1);
  background-image: var(--g3d-paper-texture-img);
  background-size: var(--g3d-paper-texture-size);
  background-repeat: repeat;
  mix-blend-mode: multiply;
}
.g3d-paper-sm > * {
  position: relative;
  z-index: calc(var(--g3d-paper-z, 1) + 3);
}

.g3d-paper-md {
  --g3d-paper-shadow: var(--g3d-paper-shadow-md);
  --_g3d-paper-color: var(
    --g3d-paper-color,
    hsl(var(--g3d-primary-h) 20% 50% / 1)
  );
}
.g3d-paper-md::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  --_g3d-glass-gradient-highlight: var(
    --g3d-glass-gradient-highlight,
    var(--g3d-primary-h) 70% 98%
  );
  --_g3d-glass-gradient-midtone: var(
    --g3d-glass-gradient-midtone,
    var(--g3d-primary-h) 40% 90%
  );
  --_g3d-glass-gradient-shadow: var(
    --g3d-glass-gradient-shadow,
    var(--g3d-primary-h) 30% 70%
  );
  --_g3d-glass-gradient-opacity: var(--g3d-glass-gradient-opacity, 0.7);
  --g3d-glass-gradient-base: linear-gradient(
    45deg,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      0%,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      10%,
    hsla(
        var(--_g3d-glass-gradient-midtone) / var(--_g3d-glass-gradient-opacity)
      )
      70%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      90%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      100%
  );
  z-index: calc(var(--g3d-paper-z) - 1);
  background: var(--g3d-glass-gradient-base);
  background-color: var(--_g3d-paper-color);
}
.g3d-paper-md {
  position: relative;
  z-index: var(--g3d-paper-z);
}
.g3d-paper-md::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--g3d-paper-z, 1) + 1);
  background-image: var(--g3d-paper-texture-img);
  background-size: var(--g3d-paper-texture-size);
  background-repeat: repeat;
  mix-blend-mode: multiply;
}
.g3d-paper-md > * {
  position: relative;
  z-index: calc(var(--g3d-paper-z, 1) + 3);
}

.g3d-paper-lg {
  --g3d-paper-shadow: var(--g3d-paper-shadow-lg);
  --_g3d-paper-color: var(
    --g3d-paper-color,
    hsl(var(--g3d-primary-h) 20% 50% / 1)
  );
}
.g3d-paper-lg::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  --_g3d-glass-gradient-highlight: var(
    --g3d-glass-gradient-highlight,
    var(--g3d-primary-h) 70% 98%
  );
  --_g3d-glass-gradient-midtone: var(
    --g3d-glass-gradient-midtone,
    var(--g3d-primary-h) 40% 90%
  );
  --_g3d-glass-gradient-shadow: var(
    --g3d-glass-gradient-shadow,
    var(--g3d-primary-h) 30% 70%
  );
  --_g3d-glass-gradient-opacity: var(--g3d-glass-gradient-opacity, 0.7);
  --g3d-glass-gradient-base: linear-gradient(
    45deg,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      0%,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      10%,
    hsla(
        var(--_g3d-glass-gradient-midtone) / var(--_g3d-glass-gradient-opacity)
      )
      70%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      90%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      100%
  );
  z-index: calc(var(--g3d-paper-z) - 1);
  background: var(--g3d-glass-gradient-base);
  background-color: var(--_g3d-paper-color);
}
.g3d-paper-lg {
  position: relative;
  z-index: var(--g3d-paper-z);
}
.g3d-paper-lg::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--g3d-paper-z, 1) + 1);
  background-image: var(--g3d-paper-texture-img);
  background-size: var(--g3d-paper-texture-size);
  background-repeat: repeat;
  mix-blend-mode: multiply;
}
.g3d-paper-lg > * {
  position: relative;
  z-index: calc(var(--g3d-paper-z, 1) + 3);
}

/* Paper BG */
/* ===================================================================================== */
:root {
  --btn-paper-h: 203;
  --btn-paper-s: 50%;
  --btn-paper-l: 95%;
  --btn-bg: hsl(var(--btn-paper-h) var(--btn-paper-s) var(--btn-paper-l));
  --paper-bg: hsl(203 20% 90%);
  --paper-noise-opacity: 0.3;
}

/* ===== Paper bg 1 ===== */
.paper-bg-1 {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  gap: 1.5rem;
  padding: 3rem;
  background: var(--paper-bg);
  position: relative;
  isolation: isolate;
}

/* Grain + very soft vignette for the background paper */
.paper-bg-1::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 120% at 30% 20%, hsla(0, 0%, 100%, 0.05), transparent 60%), radial-gradient(120% 120% at 70% 80%, hsla(0, 0%, 0%, 0.2), transparent 65%), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'><filter id='n' x='-20%' y='-20%' width='140%' height='140%'>  <feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' seed='2' stitchTiles='stitch'/>  <feColorMatrix type='saturate' values='0'/>  <feComponentTransfer><feFuncA type='table' tableValues='0 0 .12 .2 .28 .36 .44 .52 .6 .7 .8 1'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  background-size: auto, auto, 180px 180px;
  mix-blend-mode: multiply;
  opacity: var(--paper-noise-opacity);
  pointer-events: none;
}

/* ===== Paper bg 2 ===== */
.paper-bg-2 {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  gap: 2rem;
  padding: 5rem;
  background: var(--paper-bg);
  position: relative;
  isolation: isolate;
}

/* Dark fibers (visible on light) */
.paper-bg-2::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 120% at 30% 20%, hsla(0, 0%, 100%, 0.05), transparent 60%), radial-gradient(120% 120% at 70% 80%, hsla(0, 0%, 0%, 0.18), transparent 65%), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'><filter id='d' x='-20%' y='-20%' width='140%' height='140%'>  <feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' seed='2' stitchTiles='stitch'/>  <feColorMatrix type='matrix' values='0.25 0 0 0 0  0 0.26 0 0 0  0 0 0.35 0 0  0 0 0 1 0'/>  <feComponentTransfer><feFuncA type='table' tableValues='0 .35 .55 .75 1'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23d)'/></svg>");
  background-size: auto, auto, 180px 180px;
  mix-blend-mode: multiply; /* dark fibers */
  pointer-events: none;
  opacity: 0.4;
}

/* Light fibers (visible on dark) */
.paper-bg-2::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'><filter id='l' x='-20%' y='-20%' width='140%' height='140%'>  <feTurbulence type='fractalNoise' baseFrequency='1.05' numOctaves='3' seed='7' stitchTiles='stitch'/>  <feColorMatrix type='matrix' values='0.8 0 0 0 .2  0 0.85 0 0 .2  0 0 0.95 0 .2  0 0 0 1 0'/>  <feComponentTransfer><feFuncA type='table' tableValues='0 .25 .4 .6 .8 1'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23l)'/></svg>");
  background-size: 180px 180px;
  mix-blend-mode: screen; /* light fibers */
  pointer-events: none;
  opacity: 0.35;
}

/* Paper Button 1 */
/* ===================================================================================== */
@media (width >= 64rem) {
  .paper-btn-text {
    font-size: var(--g3d-text-sm);
  }
}
.paper-btn-text {
  font-family: var(--g3d-font-family-title);
  font-size: var(--g3d-text-xs);
  font-weight: 300;
  color: var(--g3d-text-color-2xmild);
  text-wrap: nowrap;
}

@media (width >= 48rem) {
  .sha-bento {
    border-radius: 2rem;
    row-gap: 3rem;
  }
}
.sha-bento {
  padding: 2rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 4rem;
  background-color: var(--paper-bg);
  border-radius: 1.5rem;
}

@media (width >= 48rem) {
  .sha-group {
    border-radius: 2rem;
  }
}
.sha-group {
  display: grid;
  gap: 4rem;
  place-items: start center;
  padding: 1rem;
  border-radius: 1.5rem;
}

@media (width >= 48rem) {
  .sha-cube {
    padding: 1.5rem;
  }
}
@media (width >= 64rem) {
  .sha-cube {
    padding: 2rem;
  }
}
.sha-cube {
  width: 100%;
  max-width: 200px;
  height: auto;
  aspect-ratio: 1/1;
  display: grid;
  place-items: end center;
  padding: 2rem;
  background-color: hsl(203, 20%, 90%);
  border-radius: 24px;
}

.paper-btn-base {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  border-radius: 12px;
  padding: 0.8rem 0;
  width: 205px;
  display: flex;
  justify-content: center;
}

.paper-btn-1 {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  border-radius: 16px;
  padding: 0.8rem 2rem;
  background: var(--btn-bg);
  position: relative;
  isolation: isolate;
  --edge-ring: hsl(0 60% 98% / 0.8); /* crisp cut edge */
  --edge-lower: hsl(203 20% 10% / 0.4); /* lower bevel line */
  box-shadow: 0 0 0 0.25px var(--edge-ring), -0.5px 0.5px 1px var(--edge-lower), -1px 1px 1px hsla(203, 20%, 10%, 0.1), -2px 2px 3px hsla(203, 20%, 10%, 0.25);
}

/* Button fibers: dark (multiply) + light (screen) */
.paper-btn-1::before,
.paper-btn-1::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
}

.paper-btn-1::before {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'><filter id='bd'>  <feTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' seed='11' stitchTiles='stitch'/>  <feColorMatrix type='matrix' values='0.35 0 0 0 0  0 0.35 0 0 0  0 0 0.45 0 0  0 0 0 1 0'/>  <feComponentTransfer><feFuncA type='table' tableValues='0 .35 .55 .75 1'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23bd)'/></svg>");
  background-size: 120px 120px;
  mix-blend-mode: multiply; /* dark fibers */
  opacity: 0.35;
}

.paper-btn-1::after {
  background: radial-gradient(70% 180% at 50% 0%, hsla(0, 0%, 100%, 0.35), transparent 60%), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'><filter id='bl'>  <feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='3' seed='5' stitchTiles='stitch'/>  <feColorMatrix type='matrix' values='0.9 0 0 0 .15  0 0.95 0 0 .15  0 0 1 0 .15  0 0 0 1 0'/>  <feComponentTransfer><feFuncA type='table' tableValues='0 .25 .45 .65 .85 1'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23bl)'/></svg>");
  background-size: auto, 120px 120px;
  mix-blend-mode: screen; /* light fibers */
  opacity: 0.32;
}

/* Emboss */
/* ===================================================================================== */
.paper-surface {
  /* Tune these to your paper */
  /*   --btn-paper-h: 210;
  --btn-paper-s: 55%;
  --btn-paper-l: 90%; */
  /* Ink/text color (fully opaque) */
  --ink: hsl(var(--btn-paper-h) 25% 9%);
  /* Edges of the pressed groove:
     - dark = slightly darker than paper
     - light = slightly lighter than paper
     Keep them NEUTRAL (no color cast). */
  --emboss-dark: hsl(
    var(--btn-paper-h) calc(var(--btn-paper-s) * 0.7)
      calc(var(--btn-paper-l) - 12%)
  );
  --emboss-dark-soft: hsl(
    var(--btn-paper-h) calc(var(--btn-paper-s) * 0.6)
      calc(var(--btn-paper-l) - 18%) / 0.55
  );
  --emboss-light: hsl(
    var(--btn-paper-h) calc(var(--btn-paper-s) * 0.2)
      calc(var(--btn-paper-l) + 8%)
  );
  --emboss-light-soft: hsl(
    var(--btn-paper-h) calc(var(--btn-paper-s) * 0.15)
      calc(var(--btn-paper-l) + 14%) / 0.55
  );
}

/* If your paper is dark, swap to this helper on the container */
:root {
  --btn-paper-l: 24%;
  --ink: hsl(var(--btn-paper-h) 15% 96%);
  --emboss-dark: hsl(203 10% 10% / 0.7);
  --emboss-dark-soft: hsl(203 15% 15% / 0.7);
  --emboss-light: hsl(203 70% 90% / 0.7);
  --emboss-light-soft: hsl(203 70% 95% / 0.7);
}

/* Base type */
.embossed {
  color: var(--ink);
  /* Improve crispness on retina & small sizes */
  text-rendering: geometricPrecision;
}

/* ===== Sizes =====
   Light source assumed from top-left.
   For a PRESSED look: top-left = dark, bottom-right = light.
*/
/* Micro (labels, chips, small UI) */
.emboss-xs {
  text-shadow: -0.5px 0.5px 0.25px var(--emboss-dark), 0.5px -0.5px 0.25px var(--emboss-light), -0.5px 0.5px 1px var(--emboss-dark-soft), 0.5px -0.5px 1px var(--emboss-light-soft);
}

.emboss-md {
  text-shadow: -1.25px -1.25px 0 var(--emboss-dark), 1.25px 1.25px 0 var(--emboss-light), -1.25px -1.25px 1.25px var(--emboss-dark-soft), 1.25px 1.25px 1.25px var(--emboss-light-soft);
}

/* ================================================== */
/* Brand spacing */
/* ================================================== */
/* Button styles */
/* ================================================== */
/* Button */
/* ================================================== */
/* Button text */
/* ================================================== */
/* Button transitions */
/* ================================================== */
/* Button structure */
/* ================================================== */
/* Round icon button structure */
/* ================================================== */
/* ================================================== */
/* Button styles */
/* ================================================== */
/* ================================================== */
/* ================================================== */
/* Button gradient  */
/* ================================================== */
/* Paper style */
/* ================================================== */
/* Paper button */
/* ================================================== */
/* ================================================== */
/* ================================================== */
/* Primary glass button */
/* ================================================== */
/* ================================================== */
/* Brand spacing */
/* ================================================== */
/* Button styles */
/* ================================================== */
/* Button */
/* ================================================== */
/* ================================================== */
/* Regular button sizing  */
/* ================================================== */
.g3d-btn-sm {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  pointer-events: auto;
  cursor: pointer;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--_btn-gap);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  border-radius: var(--_btn-radius);
}
.g3d-btn-sm > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-lg);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-sm > svg {
  width: calc(var(--_btn-content-h) * 1.15);
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-sm.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-sm.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
@media (width >= 30.5rem) {
  .g3d-btn-sm {
    --btn-content-h: 0.95rem;
  }
}
.g3d-btn-sm {
  --btn-h: var(--g3d-ui-h-sm);
  --btn-content-h: calc(var(--btn-h) * 0.2);
  --btn-padding-x: calc(var(--btn-h) * 0.55);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: 8px;
  box-shadow: var(--g3d-shadow-md);
}

.g3d-btn-md {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  pointer-events: auto;
  cursor: pointer;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--_btn-gap);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  border-radius: var(--_btn-radius);
}
.g3d-btn-md > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-lg);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-md > svg {
  width: calc(var(--_btn-content-h) * 1.15);
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-md.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-md.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
@media (width >= 30.5rem) {
  .g3d-btn-md {
    --btn-content-h: 1.15rem;
  }
}
.g3d-btn-md {
  --btn-h: var(--g3d-ui-h-md);
  --btn-content-h: 0.95rem;
  --btn-padding-x: calc(var(--btn-h) * 0.55);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: 10px;
  box-shadow: var(--g3d-shadow-lg);
}

.g3d-btn-lg {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  pointer-events: auto;
  cursor: pointer;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--_btn-gap);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  border-radius: var(--_btn-radius);
}
.g3d-btn-lg > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-lg);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-lg > svg {
  width: calc(var(--_btn-content-h) * 1.15);
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-lg.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-lg.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
@media (width >= 30.5rem) {
  .g3d-btn-lg {
    --btn-content-h: 1.15rem;
  }
}
.g3d-btn-lg {
  --btn-h: var(--g3d-ui-h-lg);
  --btn-content-h: 1rem;
  --btn-padding-x: calc(var(--btn-h) * 0.55);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: 12px;
  box-shadow: var(--g3d-shadow-xl);
}

.g3d-btn-full-w {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-content-h: var(--btn-content-h, 1rem);
  --_btn-padding-x: var(--btn-padding-x, 1.5rem);
  --_btn-padding-top: var(--btn-padding-top, 0);
  --_btn-padding-bottom: var(--btn-padding-bottom, 0);
  --_btn-gap: var(--btn-gap, 0.25rem);
  --_btn-radius: var(--btn-radius, 999px);
  pointer-events: auto;
  cursor: pointer;
  width: -moz-fit-content;
  width: fit-content;
  height: var(--_btn-h);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--_btn-gap);
  padding-top: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0; /* added to .g3d-btn-text so svg is not affected */
  padding-left: var(--_btn-padding-x);
  border-radius: var(--_btn-radius);
}
.g3d-btn-full-w > .g3d-btn-text {
  pointer-events: none;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-lg);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-align: center;
  white-space: nowrap;
  text-decoration: none;
  font-size: var(--_btn-content-h);
  line-height: var(--_btn-content-h);
  padding-top: var(--_btn-padding-top);
  padding-bottom: var(--_btn-padding-bottom);
  pointer-events: none;
}
.g3d-btn-full-w > svg {
  width: calc(var(--_btn-content-h) * 1.15);
  height: calc(var(--_btn-content-h) * 1.15);
  aspect-ratio: 1;
  pointer-events: none;
}
.g3d-btn-full-w.icon-end {
  padding-top: 0;
  padding-right: calc(var(--_btn-padding-x) * 0.8);
  padding-bottom: 0;
  padding-left: var(--_btn-padding-x);
}
.g3d-btn-full-w.icon-start {
  padding-top: 0;
  padding-right: var(--_btn-padding-x);
  padding-bottom: 0;
  padding-left: calc(var(--_btn-padding-x) * 0.8);
}
.g3d-btn-full-w {
  --btn-h: var(--g3d-ui-h-xl);
  --btn-content-h: 1.25rem;
  --btn-padding-x: calc(var(--btn-h) * 0.7);
  --btn-padding-top: 0;
  --btn-padding-bottom: 0;
  --btn-gap: calc(var(--btn-h) * 0.25);
  --btn-radius: 12px;
  width: 100%;
  box-shadow: var(--g3d-shadow-xl);
}

/* ================================================== */
/* Round icon button sizing */
/* ================================================== */
.g3d-btn-icon-sm {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-icon-h: var(--btn-icon-h, 1rem);
  pointer-events: auto;
  cursor: pointer;
  width: var(--_btn-h);
  height: var(--_btn-h);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 999px;
}
.g3d-btn-icon-sm > svg {
  width: var(--_btn-icon-h);
  height: var(--_btn-icon-h);
  aspect-ratio: 1;
  pointer-events: none;
  will-change: width, height;
  transition: width var(--g3d-speed-base) var(--g3d-smooth-cubic), height var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.g3d-btn-icon-sm:hover > svg {
  width: calc(var(--_btn-icon-h) * 1.1);
  height: calc(var(--_btn-icon-h) * 1.1);
}
.g3d-btn-icon-sm {
  --btn-h: var(--g3d-ui-h-sm);
  --btn-icon-h: calc(var(--btn-h) * 0.55);
  box-shadow: var(--g3d-shadow-sm);
}

.g3d-btn-icon-md {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-icon-h: var(--btn-icon-h, 1rem);
  pointer-events: auto;
  cursor: pointer;
  width: var(--_btn-h);
  height: var(--_btn-h);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 999px;
}
.g3d-btn-icon-md > svg {
  width: var(--_btn-icon-h);
  height: var(--_btn-icon-h);
  aspect-ratio: 1;
  pointer-events: none;
  will-change: width, height;
  transition: width var(--g3d-speed-base) var(--g3d-smooth-cubic), height var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.g3d-btn-icon-md:hover > svg {
  width: calc(var(--_btn-icon-h) * 1.1);
  height: calc(var(--_btn-icon-h) * 1.1);
}
.g3d-btn-icon-md {
  --btn-h: var(--g3d-ui-h-md);
  --btn-icon-h: calc(var(--btn-h) * 0.55);
  box-shadow: var(--g3d-shadow-md);
}

.g3d-btn-icon-lg {
  --_btn-h: var(--btn-h, 2.25rem);
  --_btn-icon-h: var(--btn-icon-h, 1rem);
  pointer-events: auto;
  cursor: pointer;
  width: var(--_btn-h);
  height: var(--_btn-h);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 999px;
}
.g3d-btn-icon-lg > svg {
  width: var(--_btn-icon-h);
  height: var(--_btn-icon-h);
  aspect-ratio: 1;
  pointer-events: none;
  will-change: width, height;
  transition: width var(--g3d-speed-base) var(--g3d-smooth-cubic), height var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.g3d-btn-icon-lg:hover > svg {
  width: calc(var(--_btn-icon-h) * 1.1);
  height: calc(var(--_btn-icon-h) * 1.1);
}
.g3d-btn-icon-lg {
  --btn-h: var(--g3d-ui-h-lg);
  --btn-icon-h: calc(var(--btn-h) * 0.55);
  box-shadow: var(--g3d-shadow-lg);
}

/* ================================================== */
/* Button style classes */
/* ================================================== */
.g3d-btn-glass-primary {
  --_btn-glass-z: var(--btn-glass-z, 3);
  /* Content */
  --_g3d-btn-text: var(--g3d-btn-text, black);
  --_btn-icon: var(--btn-icon, var(--_g3d-btn-text));
  /* hsl */
  --_btn-hsl: var(--btn-hsl, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-hover: var(--btn-hsl-hover, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-active: var(--btn-hsl-active, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-disabled: var(
    --btn-hsl-disabled,
    var(--g3d-primary-h, 210) 70% 60%
  );
  /* alpha */
  --_btn-a: var(--btn-a, 0.2);
  --_btn-a-hover: var(--btn-a-hover, 0.35);
  --_btn-a-active: var(--btn-a-active, 0.55);
  --_btn-a-disabled: var(--btn-a-disabled, 0.18);
  /* Backdrop filter strengths */
  --_btn-blur: var(--btn-blur, 8px);
  --_btn-saturate: var(--btn-saturate, 1.6);
  --_btn-brightness: var(--btn-brightness, 1);
  /* Texture */
  --_btn-texture-img: var(--btn-texture-img, var(--g3d-texture-egg-shell));
  --_btn-texture-size: var(--btn-texture-size, 100px);
  /* Bevel/Outline */
  --_btn-bevel: var(--btn-bevel, none);
  --_btn-outline: var(--btn-outline, none);
  /* Main element */
  z-index: var(--_btn-glass-z);
  position: relative;
  isolation: isolate;
  outline: var(--_btn-outline);
}
.g3d-btn-glass-primary::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) - 1);
  background-color: hsl(var(--_btn-hsl)/max(var(--_btn-a), 0.01));
  backdrop-filter: blur(var(--_btn-blur)) saturate(var(--_btn-saturate)) brightness(var(--_btn-brightness));
  /* texture */
  background-image: var(--_btn-texture-img);
  background-size: var(--_btn-texture-size);
  background-repeat: repeat;
}
.g3d-btn-glass-primary {
  /* After - bevel */
}
.g3d-btn-glass-primary::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_btn-glass-z) + 1);
  box-shadow: var(--_btn-bevel);
}
.g3d-btn-glass-primary {
  /* Content */
}
.g3d-btn-glass-primary > .g3d-btn-text {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 2);
  color: hsl(var(--_g3d-btn-text)/1);
}
.g3d-btn-glass-primary > svg {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 3);
  background-color: var(--_btn-icon);
}
.g3d-btn-glass-primary {
  /* Btn States  */
}
.g3d-btn-glass-primary:hover {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-glass-primary:focus-visible {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-glass-primary:focus-visible::after {
  box-shadow: inset 0 0 0 1px hsl(var(--g3d-primary-hs) 50%/0.5), inset 0 0 0 1.5px hsl(var(--g3d-primary-hs) 50%/0.4), inset 0 0 0 2px hsl(var(--g3d-primary-hs) 50%/0.2) !important;
}
.g3d-btn-glass-primary:active {
  --_btn-a: var(--_btn-a-active);
  --_btn-hsl: var(--_btn-hsl-active);
}
.g3d-btn-glass-primary:disabled {
  cursor: not-allowed;
  --_btn-a: var(--_btn-a-disabled);
  --_btn-hsl: var(--_btn-hsl-disabled);
}
.g3d-btn-glass-primary {
  --btn-glass-z: 3;
  /* Content color */
  --g3d-btn-text: hsl(var(--g3d-primary-h) 95% 20%);
  --btn-icon: var(--g3d-btn-text);
  /* hsla */
  --btn-hsl: var(--g3d-primary-h) 90% 80%;
  --btn-hsl-hover: var(--g3d-primary-h) 90% 75%;
  --btn-hsl-active: var(--g3d-primary-h) 90% 70%;
  --btn-hsl-disabled: var(--g3d-primary-h) 20% 60%;
  --btn-a: 0.4;
  --btn-a-hover: 0.7;
  --btn-a-active: 0.9;
  --btn-a-disabled: 0.2;
  /* backdrop-filter */
  --btn-blur: 8px;
  --btn-saturate: 2.5;
  --btn-brightness: 1.15;
  /* Texture */
  --btn-texture-img: var(--g3d-texture-egg-shell);
  --_btn-texture-size: 100px;
  /* Bevel/Outline */
  --btn-bevel: var(--g3d-bevel-xl);
  --btn-outline: none;
}

.g3d-btn-glass-secondary {
  --_btn-glass-z: var(--btn-glass-z, 3);
  /* Content */
  --_g3d-btn-text: var(--g3d-btn-text, black);
  --_btn-icon: var(--btn-icon, var(--_g3d-btn-text));
  /* hsl */
  --_btn-hsl: var(--btn-hsl, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-hover: var(--btn-hsl-hover, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-active: var(--btn-hsl-active, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-disabled: var(
    --btn-hsl-disabled,
    var(--g3d-primary-h, 210) 70% 60%
  );
  /* alpha */
  --_btn-a: var(--btn-a, 0.2);
  --_btn-a-hover: var(--btn-a-hover, 0.35);
  --_btn-a-active: var(--btn-a-active, 0.55);
  --_btn-a-disabled: var(--btn-a-disabled, 0.18);
  /* Backdrop filter strengths */
  --_btn-blur: var(--btn-blur, 8px);
  --_btn-saturate: var(--btn-saturate, 1.6);
  --_btn-brightness: var(--btn-brightness, 1);
  /* Texture */
  --_btn-texture-img: var(--btn-texture-img, var(--g3d-texture-egg-shell));
  --_btn-texture-size: var(--btn-texture-size, 100px);
  /* Bevel/Outline */
  --_btn-bevel: var(--btn-bevel, none);
  --_btn-outline: var(--btn-outline, none);
  /* Main element */
  z-index: var(--_btn-glass-z);
  position: relative;
  isolation: isolate;
  outline: var(--_btn-outline);
}
.g3d-btn-glass-secondary::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) - 1);
  background-color: hsl(var(--_btn-hsl)/max(var(--_btn-a), 0.01));
  backdrop-filter: blur(var(--_btn-blur)) saturate(var(--_btn-saturate)) brightness(var(--_btn-brightness));
  /* texture */
  background-image: var(--_btn-texture-img);
  background-size: var(--_btn-texture-size);
  background-repeat: repeat;
}
.g3d-btn-glass-secondary {
  /* After - bevel */
}
.g3d-btn-glass-secondary::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_btn-glass-z) + 1);
  box-shadow: var(--_btn-bevel);
}
.g3d-btn-glass-secondary {
  /* Content */
}
.g3d-btn-glass-secondary > .g3d-btn-text {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 2);
  color: hsl(var(--_g3d-btn-text)/1);
}
.g3d-btn-glass-secondary > svg {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 3);
  background-color: var(--_btn-icon);
}
.g3d-btn-glass-secondary {
  /* Btn States  */
}
.g3d-btn-glass-secondary:hover {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-glass-secondary:focus-visible {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-glass-secondary:focus-visible::after {
  box-shadow: inset 0 0 0 1px hsl(var(--g3d-primary-hs) 50%/0.5), inset 0 0 0 1.5px hsl(var(--g3d-primary-hs) 50%/0.4), inset 0 0 0 2px hsl(var(--g3d-primary-hs) 50%/0.2) !important;
}
.g3d-btn-glass-secondary:active {
  --_btn-a: var(--_btn-a-active);
  --_btn-hsl: var(--_btn-hsl-active);
}
.g3d-btn-glass-secondary:disabled {
  cursor: not-allowed;
  --_btn-a: var(--_btn-a-disabled);
  --_btn-hsl: var(--_btn-hsl-disabled);
}
.g3d-btn-glass-secondary {
  --btn-glass-z: 3;
  /* Content color */
  --g3d-btn-text: hsl(var(--g3d-secondary-h) 95% 5%);
  --btn-icon: var(--g3d-btn-text);
  /* hsla */
  --btn-hsl: var(--g3d-secondary-h) 90% 90%;
  --btn-hsl-hover: var(--btn-hsl);
  --btn-hsl-active: var(--btn-hsl);
  --btn-hsl-disabled: var(--g3d-secondary-h) 40% 30%;
  --btn-a: 0.4;
  --btn-a-hover: 0.5;
  --btn-a-active: 0.8;
  --btn-a-disabled: 0.2;
  /* backdrop-filter */
  --btn-blur: 10px;
  --btn-saturate: 2;
  --btn-brightness: 1;
  /* Texture */
  --btn-texture-img: var(--g3d-texture-egg-shell);
  --_btn-texture-size: 100px;
  /* Bevel/Outline */
  --btn-bevel: var(--g3d-bevel-xl);
  --btn-outline: none;
}

.g3d-btn-glass-accent {
  --_btn-glass-z: var(--btn-glass-z, 3);
  /* Content */
  --_g3d-btn-text: var(--g3d-btn-text, black);
  --_btn-icon: var(--btn-icon, var(--_g3d-btn-text));
  /* hsl */
  --_btn-hsl: var(--btn-hsl, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-hover: var(--btn-hsl-hover, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-active: var(--btn-hsl-active, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-disabled: var(
    --btn-hsl-disabled,
    var(--g3d-primary-h, 210) 70% 60%
  );
  /* alpha */
  --_btn-a: var(--btn-a, 0.2);
  --_btn-a-hover: var(--btn-a-hover, 0.35);
  --_btn-a-active: var(--btn-a-active, 0.55);
  --_btn-a-disabled: var(--btn-a-disabled, 0.18);
  /* Backdrop filter strengths */
  --_btn-blur: var(--btn-blur, 8px);
  --_btn-saturate: var(--btn-saturate, 1.6);
  --_btn-brightness: var(--btn-brightness, 1);
  /* Texture */
  --_btn-texture-img: var(--btn-texture-img, var(--g3d-texture-egg-shell));
  --_btn-texture-size: var(--btn-texture-size, 100px);
  /* Bevel/Outline */
  --_btn-bevel: var(--btn-bevel, none);
  --_btn-outline: var(--btn-outline, none);
  /* Main element */
  z-index: var(--_btn-glass-z);
  position: relative;
  isolation: isolate;
  outline: var(--_btn-outline);
}
.g3d-btn-glass-accent::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) - 1);
  background-color: hsl(var(--_btn-hsl)/max(var(--_btn-a), 0.01));
  backdrop-filter: blur(var(--_btn-blur)) saturate(var(--_btn-saturate)) brightness(var(--_btn-brightness));
  /* texture */
  background-image: var(--_btn-texture-img);
  background-size: var(--_btn-texture-size);
  background-repeat: repeat;
}
.g3d-btn-glass-accent {
  /* After - bevel */
}
.g3d-btn-glass-accent::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_btn-glass-z) + 1);
  box-shadow: var(--_btn-bevel);
}
.g3d-btn-glass-accent {
  /* Content */
}
.g3d-btn-glass-accent > .g3d-btn-text {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 2);
  color: hsl(var(--_g3d-btn-text)/1);
}
.g3d-btn-glass-accent > svg {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 3);
  background-color: var(--_btn-icon);
}
.g3d-btn-glass-accent {
  /* Btn States  */
}
.g3d-btn-glass-accent:hover {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-glass-accent:focus-visible {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-glass-accent:focus-visible::after {
  box-shadow: inset 0 0 0 1px hsl(var(--g3d-primary-hs) 50%/0.5), inset 0 0 0 1.5px hsl(var(--g3d-primary-hs) 50%/0.4), inset 0 0 0 2px hsl(var(--g3d-primary-hs) 50%/0.2) !important;
}
.g3d-btn-glass-accent:active {
  --_btn-a: var(--_btn-a-active);
  --_btn-hsl: var(--_btn-hsl-active);
}
.g3d-btn-glass-accent:disabled {
  cursor: not-allowed;
  --_btn-a: var(--_btn-a-disabled);
  --_btn-hsl: var(--_btn-hsl-disabled);
}
.g3d-btn-glass-accent {
  --btn-glass-z: 3;
  /* Content color */
  --g3d-btn-text: hsl(var(--g3d-secondary-h) 90% 30%);
  --btn-icon: var(--g3d-btn-text);
  /* hsla */
  --btn-hsl: var(--g3d-accent-h) 80% 50%;
  --btn-hsl-hover: var(--btn-hsl);
  --btn-hsl-active: var(--btn-hsl);
  --btn-hsl-disabled: var(--g3d-primary-h) 20% 60%;
  --btn-a: 0.5;
  --btn-a-hover: 0.7;
  --btn-a-active: 0.9;
  --btn-a-disabled: 0.2;
  /* backdrop-filter */
  --btn-blur: 8px;
  --btn-saturate: 2;
  --btn-brightness: 1.1;
  /* Texture */
  --btn-texture-img: var(--g3d-texture-egg-shell);
  --_btn-texture-size: 100px;
  /* Bevel/Outline */
  --btn-bevel: var(--g3d-bevel-xl);
  --btn-outline: none;
}

.g3d-btn-outline {
  --_btn-glass-z: var(--btn-glass-z, 3);
  /* Content */
  --_g3d-btn-text: var(--g3d-btn-text, black);
  --_btn-icon: var(--btn-icon, var(--_g3d-btn-text));
  /* hsl */
  --_btn-hsl: var(--btn-hsl, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-hover: var(--btn-hsl-hover, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-active: var(--btn-hsl-active, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-disabled: var(
    --btn-hsl-disabled,
    var(--g3d-primary-h, 210) 70% 60%
  );
  /* alpha */
  --_btn-a: var(--btn-a, 0.2);
  --_btn-a-hover: var(--btn-a-hover, 0.35);
  --_btn-a-active: var(--btn-a-active, 0.55);
  --_btn-a-disabled: var(--btn-a-disabled, 0.18);
  /* Backdrop filter strengths */
  --_btn-blur: var(--btn-blur, 8px);
  --_btn-saturate: var(--btn-saturate, 1.6);
  --_btn-brightness: var(--btn-brightness, 1);
  /* Texture */
  --_btn-texture-img: var(--btn-texture-img, var(--g3d-texture-egg-shell));
  --_btn-texture-size: var(--btn-texture-size, 100px);
  /* Bevel/Outline */
  --_btn-bevel: var(--btn-bevel, none);
  --_btn-outline: var(--btn-outline, none);
  /* Main element */
  z-index: var(--_btn-glass-z);
  position: relative;
  isolation: isolate;
  outline: var(--_btn-outline);
}
.g3d-btn-outline::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) - 1);
  background-color: hsl(var(--_btn-hsl)/max(var(--_btn-a), 0.01));
  backdrop-filter: blur(var(--_btn-blur)) saturate(var(--_btn-saturate)) brightness(var(--_btn-brightness));
  /* texture */
  background-image: var(--_btn-texture-img);
  background-size: var(--_btn-texture-size);
  background-repeat: repeat;
}
.g3d-btn-outline {
  /* After - bevel */
}
.g3d-btn-outline::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_btn-glass-z) + 1);
  box-shadow: var(--_btn-bevel);
}
.g3d-btn-outline {
  /* Content */
}
.g3d-btn-outline > .g3d-btn-text {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 2);
  color: hsl(var(--_g3d-btn-text)/1);
}
.g3d-btn-outline > svg {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 3);
  background-color: var(--_btn-icon);
}
.g3d-btn-outline {
  /* Btn States  */
}
.g3d-btn-outline:hover {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-outline:focus-visible {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-outline:focus-visible::after {
  box-shadow: inset 0 0 0 1px hsl(var(--g3d-primary-hs) 50%/0.5), inset 0 0 0 1.5px hsl(var(--g3d-primary-hs) 50%/0.4), inset 0 0 0 2px hsl(var(--g3d-primary-hs) 50%/0.2) !important;
}
.g3d-btn-outline:active {
  --_btn-a: var(--_btn-a-active);
  --_btn-hsl: var(--_btn-hsl-active);
}
.g3d-btn-outline:disabled {
  cursor: not-allowed;
  --_btn-a: var(--_btn-a-disabled);
  --_btn-hsl: var(--_btn-hsl-disabled);
}
.g3d-btn-outline {
  --btn-glass-z: 3;
  /* Content color */
  --g3d-btn-text: hsl(var(--g3d-primary-h) 98% 30%);
  --btn-icon: var(--g3d-btn-text);
  /* hsla */
  --btn-hsl: var(--g3d-primary-h) 70% 80%;
  --btn-hsl-hover: var(--g3d-primary-h) 70% 80%;
  --btn-hsl-active: var(--g3d-primary-h) 70% 80%;
  --btn-hsl-disabled: var(--g3d-primary-h) 20% 60%;
  --btn-a: 0.01;
  --btn-a-hover: 0.5;
  --btn-a-active: 0.9;
  --btn-a-disabled: 0.2;
  /* backdrop-filter */
  --btn-blur: 8px;
  --btn-saturate: 1.5;
  --btn-brightness: 1.1;
  /* Texture */
  --btn-texture-img: none;
  --_btn-texture-size: 0;
  /* Bevel/Outline */
  --btn-bevel: none;
  --btn-outline: 1.5px solid hsl(var(--g3d-primary-h) 98% 30% / 0.8);
}

.g3d-btn-ghost {
  --_btn-glass-z: var(--btn-glass-z, 3);
  /* Content */
  --_g3d-btn-text: var(--g3d-btn-text, black);
  --_btn-icon: var(--btn-icon, var(--_g3d-btn-text));
  /* hsl */
  --_btn-hsl: var(--btn-hsl, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-hover: var(--btn-hsl-hover, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-active: var(--btn-hsl-active, var(--g3d-primary-h, 210) 70% 60%);
  --_btn-hsl-disabled: var(
    --btn-hsl-disabled,
    var(--g3d-primary-h, 210) 70% 60%
  );
  /* alpha */
  --_btn-a: var(--btn-a, 0.2);
  --_btn-a-hover: var(--btn-a-hover, 0.35);
  --_btn-a-active: var(--btn-a-active, 0.55);
  --_btn-a-disabled: var(--btn-a-disabled, 0.18);
  /* Backdrop filter strengths */
  --_btn-blur: var(--btn-blur, 8px);
  --_btn-saturate: var(--btn-saturate, 1.6);
  --_btn-brightness: var(--btn-brightness, 1);
  /* Texture */
  --_btn-texture-img: var(--btn-texture-img, var(--g3d-texture-egg-shell));
  --_btn-texture-size: var(--btn-texture-size, 100px);
  /* Bevel/Outline */
  --_btn-bevel: var(--btn-bevel, none);
  --_btn-outline: var(--btn-outline, none);
  /* Main element */
  z-index: var(--_btn-glass-z);
  position: relative;
  isolation: isolate;
  outline: var(--_btn-outline);
}
.g3d-btn-ghost::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) - 1);
  background-color: hsl(var(--_btn-hsl)/max(var(--_btn-a), 0.01));
  backdrop-filter: blur(var(--_btn-blur)) saturate(var(--_btn-saturate)) brightness(var(--_btn-brightness));
  /* texture */
  background-image: var(--_btn-texture-img);
  background-size: var(--_btn-texture-size);
  background-repeat: repeat;
}
.g3d-btn-ghost {
  /* After - bevel */
}
.g3d-btn-ghost::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_btn-glass-z) + 1);
  box-shadow: var(--_btn-bevel);
}
.g3d-btn-ghost {
  /* Content */
}
.g3d-btn-ghost > .g3d-btn-text {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 2);
  color: hsl(var(--_g3d-btn-text)/1);
}
.g3d-btn-ghost > svg {
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  z-index: calc(var(--_btn-glass-z) + 3);
  background-color: var(--_btn-icon);
}
.g3d-btn-ghost {
  /* Btn States  */
}
.g3d-btn-ghost:hover {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-ghost:focus-visible {
  --_btn-a: var(--_btn-a-hover);
  --_btn-hsl: var(--_btn-hsl-hover);
}
.g3d-btn-ghost:focus-visible::after {
  box-shadow: inset 0 0 0 1px hsl(var(--g3d-primary-hs) 50%/0.5), inset 0 0 0 1.5px hsl(var(--g3d-primary-hs) 50%/0.4), inset 0 0 0 2px hsl(var(--g3d-primary-hs) 50%/0.2) !important;
}
.g3d-btn-ghost:active {
  --_btn-a: var(--_btn-a-active);
  --_btn-hsl: var(--_btn-hsl-active);
}
.g3d-btn-ghost:disabled {
  cursor: not-allowed;
  --_btn-a: var(--_btn-a-disabled);
  --_btn-hsl: var(--_btn-hsl-disabled);
}
.g3d-btn-ghost {
  --btn-glass-z: 3;
  /* Content color */
  --g3d-btn-text: hsl(var(--g3d-primary-h) 98% 20%);
  --btn-icon: var(--g3d-btn-text);
  /* hsla */
  --btn-hsl: var(--g3d-primary-h) 50% 80%;
  --btn-hsl-hover: var(--g3d-primary-h) 50% 80%;
  --btn-hsl-active: var(--g3d-primary-h) 50% 80%;
  --btn-hsl-disabled: var(--g3d-primary-h) 20% 60%;
  --btn-a: 0.01;
  --btn-a-hover: 0.4;
  --btn-a-active: 0.7;
  --btn-a-disabled: 0.2;
  /* backdrop-filter */
  --btn-blur: 4px;
  --btn-saturate: 1.05;
  --btn-brightness: 1.07;
  /* Texture */
  --btn-texture-img: none;
  --_btn-texture-size: 0;
  /* Bevel/Outline */
  --btn-bevel: none;
  box-shadow: none;
}

.g3d-btn-paper {
  --_g3d-btn-text: var(--g3d-btn-text, black);
  --_btn-icon: var(--btn-icon, var(--_g3d-btn-text));
  --_btn-bg: var(--btn-bg, hsla(107, 49%, 64%, 1));
  --_btn-state-text: var(--btn-state-text, var(--_g3d-btn-text));
  --_btn-state-icon: var(--btn-state-icon, var(--_btn-state-text));
  --_btn-shadow: var(--btn-shadow, var(--g3d-paper-shadow-sm));
  --_btn-hover: var(--btn-hover, rgb(3, 66, 155));
  --_btn-focus: var(--btn-focus, rgb(155, 3, 112));
  --_btn-active: var(--btn-active, rgb(155, 59, 3));
  --_btn-disabled: var(--btn-disabled, rgb(33, 3, 155));
  position: relative;
  z-index: var(--g3d-paper-z);
  box-shadow: var(--_btn-shadow);
}
.g3d-btn-paper::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  --g3d-glass-gradient-highlight: var(--g3d-primary-h) 100% 93%;
  --g3d-glass-gradient-midtone: var(--g3d-primary-h) 100% 85%;
  --g3d-glass-gradient-shadow: var(--g3d-primary-h) 100% 70%;
  --g3d-glass-gradient-opacity: 0.5;
  background: linear-gradient(45deg, hsla(var(--g3d-glass-gradient-shadow)/var(--g3d-glass-gradient-opacity)) 0%, hsla(var(--g3d-glass-gradient-shadow)/var(--g3d-glass-gradient-opacity)) 10%, hsla(var(--g3d-glass-gradient-midtone)/var(--g3d-glass-gradient-opacity)) 70%, hsla(var(--g3d-glass-gradient-highlight)/var(--g3d-glass-gradient-opacity)) 90%, hsla(var(--g3d-glass-gradient-highlight)/var(--g3d-glass-gradient-opacity)) 100%);
  z-index: calc(var(--g3d-paper-z) - 1);
  background-color: var(--_btn-bg);
  will-change: background-color;
  transition: background-color var(--g3d-speed-slow) var(--g3d-smooth-cubic);
}
.g3d-btn-paper::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--g3d-paper-z, 1) + 1);
  background-image: var(--g3d-paper-texture-img);
  background-size: var(--g3d-texture-lg);
  background-repeat: repeat;
}
.g3d-btn-paper > .g3d-btn-text {
  z-index: calc(var(--g3d-paper-z, 1) + 3);
  color: var(--_g3d-btn-text);
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.g3d-btn-paper > svg {
  z-index: calc(var(--g3d-paper-z, 1) + 3);
  background-color: var(--_btn-icon);
  will-change: background-color;
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
.g3d-btn-paper:hover > .g3d-btn-text {
  color: var(--_btn-state-text);
}
.g3d-btn-paper:hover > svg {
  background-color: var(--_btn-state-icon);
}
.g3d-btn-paper:hover::before {
  background-color: var(--_btn-hover);
}
.g3d-btn-paper:focus-visible > .g3d-btn-text {
  color: var(--_btn-state-text);
}
.g3d-btn-paper:focus-visible > svg {
  background-color: var(--_btn-state-icon);
}
.g3d-btn-paper:focus-visible::before {
  background-color: var(--_btn-focus);
}
.g3d-btn-paper:focus-visible::after {
  box-shadow: inset 0 0 0 1px hsl(var(--g3d-primary-hs) 50%/0.5), inset 0 0 0 1.5px hsl(var(--g3d-primary-hs) 50%/0.4), inset 0 0 0 2px hsl(var(--g3d-primary-hs) 50%/0.2) !important;
}
.g3d-btn-paper:active > .g3d-btn-text {
  color: var(--_btn-state-text);
}
.g3d-btn-paper:active > svg {
  background-color: var(--_btn-state-icon);
}
.g3d-btn-paper:active::before {
  background-color: var(--_btn-active);
}
.g3d-btn-paper:disabled {
  cursor: not-allowed;
  background-color: var(--_btn-disabled);
}
.g3d-btn-paper {
  --g3d-btn-text: var(--g3d-text-color-xstrong);
  --btn-bg: hsl(var(--g3d-primary-h) 95% 98%);
  --btn-state-text: var(--g3d-text-color-xstrong);
  --btn-shadow: var(--g3d-paper-shadow-sm);
  --btn-hover: hsl(var(--g3d-primary-h) 90% 80%);
  --btn-focus: hsl(var(--g3d-primary-h) 90% 80%);
  --btn-active: hsl(var(--g3d-primary-h) 100% 70%);
  --btn-disabled: hsl(var(--g3d-primary-h) 20% 50%);
}

/* ================================================== */
/* Aggregate Design SCSS */
/* ================================================== */
/* ================================================== */
/* Text styles */
/* ================================================== */
.g3d-title-xl {
  font-family: var(--g3d-font-title);
  font-style: normal;
  font-weight: 500;
  font-size: var(--g3d-text-xl);
  line-height: var(--g3d-line-height-2xs);
}

.g3d-title-2xl {
  font-family: var(--g3d-font-title);
  font-style: normal;
  font-weight: 500;
  font-size: var(--g3d-text-2xl);
  line-height: var(--g3d-line-height-xs);
}

body,
p,
input,
textarea {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-sm);
}

.g3d-font-style-body {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-sm);
}

.g3d-font-style-body-md {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-md);
}

.g3d-font-style-body-lg {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-lg);
}

.g3d-body-bold {
  font-weight: var(--g3d-font-weight-lg);
}

.g3d-title-thin-lg {
  font-family: var(--g3d-font-title);
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-lg);
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: var(--g3d-line-height-sm);
  text-shadow: var(--g3d-text-shadow-xs);
  color: var(--g3d-text-color-strong);
}

.g3d-title-thin-md {
  font-family: var(--g3d-font-title);
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-md);
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: var(--g3d-line-height-sm);
  text-shadow: var(--g3d-text-shadow-xs);
  color: var(--g3d-text-color-strong);
}

.g3d-title-thin {
  font-family: var(--g3d-font-title);
  font-style: normal;
  font-weight: var(--g3d-font-weight-xs);
  font-size: var(--g3d-text-3xl);
  letter-spacing: var(--g3d-letter-spacing-md);
  line-height: var(--g3d-line-height-xs);
  text-shadow: var(--g3d-text-shadow-md);
  color: var(--g3d-font-color-accent-base);
}

.g3d-big-title {
  font-family: var(--g3d-font-title);
  font-style: normal;
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-3xl);
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: var(--g3d-line-height-xs);
  text-shadow: var(--g3d-text-shadow-xs);
}

.g3d-footnote {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-xs);
}

.g3d-text-display-4xl {
  font-family: var(--g3d-font-display);
  font-size: var(--g3d-text-4xl);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: var(--g3d-line-height-xs);
  text-shadow: var(--g3d-text-shadow-xs);
  word-spacing: -0.4ch;
}

.g3d-text-display-5xl {
  font-family: var(--g3d-font-display);
  font-size: var(--g3d-text-5xl);
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: var(--g3d-line-height-sm);
  text-shadow: var(--g3d-text-shadow-xs);
}

.g3d-text-display-2xl {
  font-family: var(--g3d-font-display);
  font-size: var(--g3d-text-2xl);
  letter-spacing: 0;
  line-height: 1;
  text-shadow: var(--g3d-text-shadow-2xs);
}

.g3d-eyebrow {
  font-family: var(--g3d-font-code);
  font-size: var(--g3d-text-xs);
  letter-spacing: var(--g3d-letter-spacing-md);
  line-height: var(--g3d-line-height-md);
  text-shadow: var(--g3d-text-shadow-xs);
  text-transform: uppercase;
  color: var(--g3d-text-color-xmild);
}

.g3d-highlight-text {
  padding: 0 0.25em;
  background-color: var(--g3d-highlight-color);
  border-radius: 0.2em;
}

.page-title-text {
  font-family: var(--g3d-font-display);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-5xl);
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: var(--g3d-line-height-2xs);
  text-shadow: var(--g3d-text-shadow-xs);
}
@media (width >= 80rem) {
  .page-title-text {
    font-size: var(--g3d-text-6xl);
  }
}

/* ================================================== */
/* Brand shadows */
/* ================================================== */
:root {
  --g3d-shadow-color: 235 10% 15%;
  --g3d-highlight-color: 203 80% 98%;
  --g3d-paper-shadow-2xs:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0 0 0.2px hsl(var(--g3d-shadow-color) / 0.1),
    -0.25px 0.25px 0.5px hsl(var(--g3d-shadow-color) / 0.1),
    -0.5px 0.5px 1px hsl(var(--g3d-shadow-color) / 0.1);
  --g3d-paper-shadow-xs:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0 0 0.2px hsl(var(--g3d-shadow-color) / 0.1),
    -0.25px 0.25px 0.5px hsl(var(--g3d-shadow-color) / 0.15),
    -0.5px 0.5px 1px hsl(var(--g3d-shadow-color) / 0.15),
    -1px 1px 2px hsl(var(--g3d-shadow-color) / 0.1);
  --g3d-paper-shadow-sm:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.15),
    -0.25px 0.25px 0.5px hsl(var(--g3d-shadow-color) / 0.2),
    -0.5px 0.5px 1px hsl(var(--g3d-shadow-color) / 0.1),
    -1px 1px 2px hsl(var(--g3d-shadow-color) / 0.1),
    -2px 2px 4px hsl(var(--g3d-shadow-color) / 0.1);
  --g3d-paper-shadow-md:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.15),
    -0.25px 0.25px 0.5px hsl(var(--g3d-shadow-color) / 0.15),
    -0.5px 0.5px 1px hsl(var(--g3d-shadow-color) / 0.1),
    -1px 1px 2px hsl(var(--g3d-shadow-color) / 0.1),
    -2px 2px 4px hsl(var(--g3d-shadow-color) / 0.1),
    -3px 3px 5px hsl(var(--g3d-shadow-color) / 0.07);
  --g3d-paper-shadow-lg:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.15),
    -0.25px 0.25px 0.5px hsl(var(--g3d-shadow-color) / 0.15),
    -0.5px 0.5px 1px hsl(var(--g3d-shadow-color) / 0.07),
    -1px 1px 2px hsl(var(--g3d-shadow-color) / 0.07),
    -2px 2px 4px hsl(var(--g3d-shadow-color) / 0.1),
    -3px 3px 5px hsl(var(--g3d-shadow-color) / 0.07),
    -4px 4px 6px hsl(var(--g3d-shadow-color) / 0.07);
  /* ================================================== */
  /* Regular shadows */
  /* ================================================== */
  --g3d-shadow-3xs:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.15),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.1),
    -0.5px 0.5px 1.5px hsl(var(--g3d-shadow) / 0.1);
  --g3d-shadow-2xs:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.15),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.1),
    -1px 1px 3px hsl(var(--g3d-shadow) / 0.1);
  --g3d-shadow-xs:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.15),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.1),
    -1px 1px 3px hsl(var(--g3d-shadow) / 0.07),
    -2px 2px 4px -1px hsl(var(--g3d-shadow) / 0.1);
  --g3d-shadow-sm:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.15),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.1),
    -1px 1px 3px hsl(var(--g3d-shadow) / 0.07),
    -2px 2px 4px -1px hsl(var(--g3d-shadow) / 0.1),
    -3px 3px 6px -2px hsl(var(--g3d-shadow) / 0.08);
  --g3d-shadow-md:
    0 0 0.25px hsl(var(--g3d-highlight-color) / 0.1),
    0.25px -0.25px 0.25px hsl(var(--g3d-highlight-color) / 0.15),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.1),
    -1px 1px 3px hsl(var(--g3d-shadow) / 0.07),
    -2px 2px 4px -1px hsl(var(--g3d-shadow) / 0.1),
    -4px 4px 8px -2px hsl(var(--g3d-shadow) / 0.08);
  --g3d-shadow-lg:
    0 0 0.5px hsl(var(--g3d-highlight-color) / 0.08),
    0.5px -0.5px 1px hsl(var(--g3d-highlight-color) / 0.08),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.1),
    -2px 2px 4px hsl(var(--g3d-shadow) / 0.1),
    -6px 6px 12px -1px hsl(var(--g3d-shadow) / 0.1),
    -7px 7px 14px -2px hsl(var(--g3d-shadow) / 0.08);
  --g3d-shadow-xl:
    0 0 0.5px hsl(var(--g3d-highlight-color) / 0.08),
    0.5px -0.5px 1px hsl(var(--g3d-highlight-color) / 0.08),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.15),
    -2px 2px 4px hsl(var(--g3d-shadow) / 0.1),
    -6px 6px 14px -1px hsl(var(--g3d-shadow) / 0.1),
    -8px 8px 16px -2px hsl(var(--g3d-shadow) / 0.1);
  --g3d-shadow-2xl:
    0 0 0.5px hsl(var(--g3d-highlight-color) / 0.1),
    0.5px -0.5px 1px hsl(var(--g3d-highlight-color) / 0.1),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.15),
    -2px 2px 4px hsl(var(--g3d-shadow) / 0.1),
    -8px 8px 16px -2px hsl(var(--g3d-shadow) / 0.15),
    -9px 9px 18px -2px hsl(var(--g3d-shadow) / 0.1);
  --g3d-shadow-3xl:
    0 0 0.5px hsl(var(--g3d-highlight-color) / 0.12),
    0.5px -0.5px 1px hsl(var(--g3d-highlight-color) / 0.12),
    0 0 0.25px hsl(var(--g3d-shadow) / 0.07),
    0 0 0.5px hsl(var(--g3d-shadow) / 0.05),
    -0.5px 0.5px 0.5px hsl(var(--g3d-shadow) / 0.1),
    -2px 2px 4px hsl(var(--g3d-shadow) / 0.1),
    -9px 9px 18px -2px hsl(var(--g3d-shadow) / 0.15),
    -12px 12px 24px -3px hsl(var(--g3d-shadow) / 0.12);
}

.g3d-shadow-3xs {
  box-shadow: var(--g3d-shadow-3xs);
}

.g3d-shadow-2xs {
  box-shadow: var(--g3d-shadow-2xs);
}

.g3d-shadow-xs {
  box-shadow: var(--g3d-shadow-xs);
}

.g3d-shadow-sm {
  box-shadow: var(--g3d-shadow-sm);
}

.g3d-shadow-md {
  box-shadow: var(--g3d-shadow-md);
}

.g3d-shadow-lg {
  box-shadow: var(--g3d-shadow-lg);
}

.g3d-shadow-xl {
  box-shadow: var(--g3d-shadow-xl);
}

.g3d-shadow-2xl {
  box-shadow: var(--g3d-shadow-2xl);
}

.g3d-shadow-3xl {
  box-shadow: var(--g3d-shadow-3xl);
}

/* ================================================== */
/* Bevels */
/* ================================================== */
:root {
  --g3d-bevel-none: none;
  --g3d-bevel-xs:
    inset -1px 1px 0.5px -1.5px hsl(var(--g3d-highlight) / 0.7),
    inset -1.5px 1.5px 0.75px -2.75px hsl(var(--g3d-highlight) / 0.5),
    inset -0.25px 0.25px 0.5px -0.25px hsl(var(--g3d-highlight) / 0.15),
    inset -0.25px 0.25px 0.25px hsl(var(--g3d-highlight) / 0.08),
    inset 0 0 0.25px 0.25px hsl(var(--g3d-highlight) / 0.03);
  --g3d-bevel-sm:
    inset -1.5px 1.5px 0.75px -2.75px hsl(var(--g3d-highlight) / 0.9),
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.7),
    inset -0.5px 0.5px 0.5px -0.25px hsl(var(--g3d-highlight) / 0.1),
    inset -0.5px 0.5px 0.25px hsl(var(--g3d-highlight) / 0.05),
    inset 0 0 0.25px 0.25px hsl(var(--g3d-highlight) / 0.03);
  --g3d-bevel-md:
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.8),
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.5),
    inset -1px 1px 1px -0.5px hsl(var(--g3d-highlight) / 0.15),
    inset -1px 1px 0.25px hsl(var(--g3d-highlight) / 0.03),
    inset 0 0 0.25px 0.5px hsl(var(--g3d-highlight) / 0.03);
  --g3d-bevel-lg:
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.8),
    inset -3px 3px 1.5px -4.5px hsl(var(--g3d-highlight) / 0.5),
    inset -1.25px 1.25px 1.25px -0.75px hsl(var(--g3d-highlight) / 0.15),
    inset -1.25px 1.25px 0.25px hsl(var(--g3d-highlight) / 0.03),
    inset 0 0 0.25px 0.5px hsl(var(--g3d-highlight) / 0.03);
  --g3d-bevel-xl:
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.8),
    inset -4px 4px 2px -6px hsl(var(--g3d-highlight) / 0.5),
    inset -1.5px 1.5px 1.5px -0.75px hsl(var(--g3d-highlight) / 0.25),
    inset -1.5px 1.5px 0.25px hsl(var(--g3d-highlight) / 0.03),
    inset 1.5px -1.5px 0.5px hsl(var(--g3d-shadow) / 0.05),
    inset 1px -1px 0.25px hsl(var(--g3d-shadow) / 0.08);
  --g3d-bevel-2xl:
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.8),
    inset -4px 4px 2px -6px hsl(var(--g3d-highlight) / 0.5),
    inset -1.5px 1.5px 0.5px hsl(var(--g3d-highlight) / 0.08),
    inset -0.5px 0.5px 1px 0.5px hsl(var(--g3d-highlight) / 0.1),
    inset -1.25px 1.25px hsl(var(--g3d-highlight) / 0.05),
    inset 1.5px -1.5px 1.5px hsl(var(--g3d-shadow) / 0.15),
    inset 1px -1px 1px hsl(var(--g3d-shadow) / 0.1);
  --g3d-bevel-3xl:
    inset -2px 2px 1px -3px hsl(var(--g3d-highlight) / 0.8),
    inset -4px 4px 2px -6px hsl(var(--g3d-highlight) / 0.7),
    inset -1.5px 1.5px 1.2px -0.5px hsl(var(--g3d-highlight) / 0.15),
    inset -1.5px 1.5px 1.25px 0px hsl(var(--g3d-highlight) / 0.15),
    inset -2px 2px 0.25px hsl(var(--g3d-highlight) / 0.15),
    inset 2px -2px 0.5px hsl(var(--g3d-shadow) / 0.05),
    inset 1.5px -1.5px 0.25px hsl(var(--g3d-shadow) / 0.08);
  /* e2e bevels */
  /* ================================================== */
  /** Use when glass element width fills the whole viewport width
  *   or if component is designed to touch screen edge e.g. g3d-marquee 
  *   else the x-offsets will look like a weird line down screen edge
  *
  *  Steps to convert from a regular bevel (has x-offset) to an e2e-bevel (only y-offset) 
  *  1. new x-offset = 0px
  *  2. add spread   -> same as blur but negative 
  *  3. if original has spread -> new y-offset = old y-offset + blur + old spread
  *  3. if original has no spread -> new y-offset = old y-offset + blur
  *
  *  inset -0.5px 0.5px 1px 0.5px   will look the same as:
  *  inset    0px   2px 1px  -1px
  *
  *  inset 1px -1px 1px             will look the same as:
  *  inset 0px -2px 1px -1px
  */
  --g3d-e2e-bevel-sm:
    inset 0 0.25px 0.35px -0.23px hsl(var(--g3d-highlight) / 0.15),
    inset 0 0.5px 0.5px -0.25px hsl(var(--g3d-highlight) / 0.1),
    inset 0 0.5px 0.1px 0 hsl(var(--g3d-highlight) / 0.08),
    inset 0 -1px 0.5px -0.5px hsl(var(--g3d-shadow) / 0.05),
    inset 0 -0.5px 0.25px -0.25px hsl(var(--g3d-shadow) / 0.08);
  --g3d-e2e-bevel-md:
    inset 0 0.25px 0.35px -0.23px hsl(var(--g3d-highlight) / 0.2),
    inset 0 1px 1px -1px hsl(var(--g3d-highlight) / 0.1),
    inset 0 0.8px 0.2px hsl(var(--g3d-highlight) / 0.08),
    inset 0 -1px 0.5px -0.5px hsl(var(--g3d-shadow) / 0.08),
    inset 0 -0.5px 0.25px -0.25px hsl(var(--g3d-shadow) / 0.08);
  --g3d-e2e-bevel-lg:
    inset 0 0.25px 0.35px -0.22px hsl(var(--g3d-highlight) / 0.92),
    inset 0 1px 1.25px -1px hsl(var(--g3d-highlight) / 0.915),
    inset 0 1px 0.1px hsl(var(--g3d-highlight) / 0.91),
    inset 0 1.5px 0.25px hsl(var(--g3d-highlight) / 0.91),
    inset 0 -1.5px 0.5px -0.5px hsl(var(--g3d-shadow) / 0.908),
    inset 0 -1px 0.25px -0.25px hsl(var(--g3d-shadow) / 0.908);
  --g3d-e2e-bevel-2xl:
    inset 0 2px 0.5px -0.5px hsl(var(--g3d-highlight) / 0.08),
    inset 0 2px 1px -1px hsl(var(--g3d-highlight) / 0.1),
    inset 0 1.25px hsl(var(--g3d-highlight) / 0.05),
    inset 0 -3px 1.5px -1.5px hsl(var(--g3d-shadow) / 0.15),
    inset 0 -2px 1px -1px hsl(var(--g3d-shadow) / 0.1);
}

/* Bevel classes */
/* ================================================== */
.g3d-bevel-none {
  box-shadow: var(--g3d-bevel-none);
}

.g3d-bevel-xs {
  box-shadow: var(--g3d-bevel-xs);
}

.g3d-bevel-sm {
  box-shadow: var(--g3d-bevel-sm);
}

.g3d-bevel-md {
  box-shadow: var(--g3d-bevel-md);
}

.g3d-bevel-lg {
  box-shadow: var(--g3d-bevel-lg);
}

.g3d-bevel-xl {
  box-shadow: var(--g3d-bevel-xl);
}

.g3d-e2e-bevel-sm {
  box-shadow: var(--g3d-e2e-bevel-sm);
}

.g3d-e2e-bevel-md {
  box-shadow: var(--g3d-e2e-bevel-md);
}

.g3d-e2e-bevel-lg {
  box-shadow: var(--g3d-e2e-bevel-lg);
}

/* ================================================== */
/* Paper textures */
/* ================================================== */
:root {
  --g3d-texture-egg-shell: url("/textures/egg-shell.png");
  --g3d-texture-light: url("/textures/noise-texture-both-500x500.png");
}

/* ===============================
   Noise Library (monochrome SVGs)
   Usage:
     background-image: var(--noise-speckle-md);
     mix-blend-mode: multiply;   // for darkening
     opacity: .28;               // dial visibility
   Tip: layer a light + dark pass:
     background-image:
       var(--noise-light-md),    // screen
       var(--noise-dark-md);     // multiply
================================= */
/* ===============================
   Lightweight helpers
================================= */
/* Put this on ::before or ::after (or element itself) */
/* =========================================
   Embossed / Debossed Text Shadows (HSL)
   ========================================= */
/* Put these on the container (page, card, button) */
/* ==================================================================================
   Embossed (debossed) text-shadow library
   - HSL only, neutral monochrome
   - Tuned for light paper; dark-paper variants included
   - Uses two hard shadows (highlight + occlusion)
   - Keep blur = 0 for crisp paper edges
========================================= */
/* Global knobs (adjust once per theme) */
/* ================================================== */
/* Aggregate Components SCSS */
/* ================================================== */
/* ================================================== */
/* Basic layouts */
/* ================================================== */
.g3d-radius-for-big {
  border-radius: max(0px, min(var(--g3d-sm), (100vw - 15px - 100%) * 9999))/var(--g3d-sm);
}
@media (width >= 48rem) {
  .g3d-radius-for-big {
    border-radius: max(0px, min(var(--g3d-md), (100vw - 15px - 100%) * 9999))/var(--g3d-md);
  }
}

.g3d-shadow-for-big {
  box-shadow: var(--g3d-shadow-sm);
  border-radius: max(0px, min(var(--g3d-sm), (100vw - 15px - 100%) * 9999))/var(--g3d-sm);
  box-shadow: var(--g3d-shadow-md);
}
@media (width >= 30.5rem) {
  .g3d-shadow-for-big {
    box-shadow: var(--g3d-shadow-lg);
  }
}
@media (width >= 64rem) {
  .g3d-shadow-for-big {
    box-shadow: var(--g3d-shadow-lg);
  }
}

.g3d-layout-2-1 {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--g3d-xl);
  place-items: center;
}
@media (width >= 64rem) {
  .g3d-layout-2-1 {
    grid-template-columns: 2fr 1fr;
    gap: var(--g3d-5xl);
    place-items: end center;
  }
}

@media (width >= 48rem) {
  .g3d-layout-img-card {
    grid-template-columns: 1.25fr 1fr;
    gap: 2rem;
  }
}
.g3d-layout-img-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--g3d-3xl);
  place-items: center;
}
.g3d-layout-img-card > .g3d-card {
  max-width: 500px;
}

.g3d-paper-card {
  --g3d-paper-color: hsl(var(--g3d-primary-h) 30% 95%);
  --g3d-glass-gradient-highlight: var(--g3d-primary-h) 90% 95%;
  --g3d-glass-gradient-midtone: var(--g3d-primary-h) 80% 90%;
  --g3d-glass-gradient-shadow: var(--g3d-primary-h) 60% 70%;
  --g3d-glass-gradient-opacity: 0.5;
  --_g3d-paper-color: var(
    --g3d-paper-color,
    hsl(var(--g3d-primary-h) 20% 50% / 1)
  );
}
.g3d-paper-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  --_g3d-glass-gradient-highlight: var(
    --g3d-glass-gradient-highlight,
    var(--g3d-primary-h) 70% 98%
  );
  --_g3d-glass-gradient-midtone: var(
    --g3d-glass-gradient-midtone,
    var(--g3d-primary-h) 40% 90%
  );
  --_g3d-glass-gradient-shadow: var(
    --g3d-glass-gradient-shadow,
    var(--g3d-primary-h) 30% 70%
  );
  --_g3d-glass-gradient-opacity: var(--g3d-glass-gradient-opacity, 0.7);
  --g3d-glass-gradient-base: linear-gradient(
    45deg,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      0%,
    hsla(var(--_g3d-glass-gradient-shadow) / var(--_g3d-glass-gradient-opacity))
      10%,
    hsla(
        var(--_g3d-glass-gradient-midtone) / var(--_g3d-glass-gradient-opacity)
      )
      70%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      90%,
    hsla(
        var(--_g3d-glass-gradient-highlight) /
          var(--_g3d-glass-gradient-opacity)
      )
      100%
  );
  z-index: calc(var(--g3d-paper-z) - 1);
  background: var(--g3d-glass-gradient-base);
  background-color: var(--_g3d-paper-color);
}
.g3d-paper-card {
  position: relative;
  z-index: var(--g3d-paper-z);
}
.g3d-paper-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--g3d-paper-z, 1) + 1);
  background-image: var(--g3d-paper-texture-img);
  background-size: var(--g3d-paper-texture-size);
  background-repeat: repeat;
  mix-blend-mode: multiply;
}
.g3d-paper-card > * {
  position: relative;
  z-index: calc(var(--g3d-paper-z, 1) + 3);
}
.g3d-paper-card {
  box-shadow: var(--g3d-shadow-xl);
}

/* ================================================== */
/* Brand Card */
/* ================================================== */
/* Card base */
/* ================================================== */
.g3d-card {
  --_space: var(--space, 1rem);
  --_gap: calc(var(--space, 1rem) * 0.75);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  --_card-radius: var(--card-radius, 1.5rem);
  z-index: var(--g3d-z-card);
  position: relative;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--_gap);
  padding: var(--_space);
  pointer-events: auto;
  border-radius: var(--_card-radius);
}

.g3d-card-roomy {
  --_space: var(--space, 1rem);
  --_gap: calc(var(--space, 1rem) * 0.75);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  --_card-radius: var(--card-radius, 1.5rem);
  z-index: var(--g3d-z-card);
  position: relative;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--_gap);
  padding: var(--_space);
  pointer-events: auto;
  border-radius: var(--_card-radius);
  --space: calc(var(--space) * 1.5);
  --card-radius: calc(var(--card-radius) * 1.25);
}

/* Cards that fit the width of their content */
/* ================================================== */
.g3d-card-fit-compact {
  --_space: var(--space, 1rem);
  --_gap: calc(var(--space, 1rem) * 0.75);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  --_card-radius: var(--card-radius, 1.5rem);
  z-index: var(--g3d-z-card);
  position: relative;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--_gap);
  padding: var(--_space);
  pointer-events: auto;
  border-radius: var(--_card-radius);
  --space: var(--g3d-xl);
  max-width: 100%;
  width: -moz-fit-content;
  width: fit-content;
  border-radius: max(0px, min(var(--g3d-md), (100vw - 15px - 100%) * 9999))/var(--g3d-md);
}

.g3d-card-fit-roomy {
  --_space: var(--space, 1rem);
  --_gap: calc(var(--space, 1rem) * 0.75);
  --neg-space: calc(-1 * var(--_space));
  --_neg-space: var(--neg-space, -1rem);
  --_card-radius: var(--card-radius, 1.5rem);
  z-index: var(--g3d-z-card);
  position: relative;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--_gap);
  padding: var(--_space);
  pointer-events: auto;
  border-radius: var(--_card-radius);
  --space: var(--g3d-3xl);
  max-width: 100%;
  width: -moz-fit-content;
  width: fit-content;
  border-radius: max(0px, min(var(--g3d-lg), (100vw - 15px - 100%) * 9999))/var(--g3d-lg);
}

/* Card children */
/* ================================================== */
.g3d-card-title-group {
  display: grid;
  gap: 0.6em;
}

.g3d-card-padding-top {
  padding-top: var(--g3d-sm);
}
@media (width >= 48rem) {
  .g3d-card-padding-top {
    padding-top: var(--g3d-md);
  }
}
@media (width >= 64rem) {
  .g3d-card-padding-top {
    padding-top: var(--g3d-lg);
  }
}

.g3d-card-title-lg {
  font-family: var(--g3d-font-title);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-3xl);
  letter-spacing: var(--g3d-letter-spacing-2xs);
  line-height: var(--g3d-line-height-xs);
  color: hsl(var(--g3d-secondary-h), 90%, 30%, 1);
  text-shadow: var(--g3d-text-shadow-sm);
}

.g3d-card-title-md {
  font-family: var(--g3d-font-title);
  font-weight: 600;
  font-size: var(--g3d-text-xl);
  letter-spacing: var(--g3d-letter-spacing-2xs);
  line-height: var(--g3d-line-height-xs);
  color: hsl(var(--g3d-secondary-h), 60%, 20%, 1);
}

.g3d-card-subtitle {
  font-family: var(--g3d-font-title);
  font-weight: 500;
  font-size: var(--g3d-text-sm);
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: var(--g3d-line-height-xs);
  color: var(--g3d-text-color-base);
}

.g3d-card-text {
  font-family: var(--g3d-font-body);
  font-weight: 400;
  font-size: var(--g3d-text-md);
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: var(--g3d-line-height-sm);
  color: var(--g3d-text-color-mild);
}

.g3d-card-inset-bg {
  background-color: var(--g3d-inset-bg-);
}

.g3d-card-actions {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
}

/* ================================================== */
/* Card container queries */
/* ================================================== */
.g3d-card-cq {
  container-name: g3d-card-cq;
  container-type: inline-size;
  width: 100%;
}

/* 360px and smaller */
@container g3d-card-cq (width < 360px ) {
  .g3d-card {
    --space: 1.5rem;
    --card-radius: 16px;
  }
  .g3d-card-title-group {
    gap: 0.5rem;
  }
  .g3d-card-title-lg {
    font-size: 7.5cqw;
  }
  .g3d-card-title-md {
    font-size: var(--g3d-text-lg);
  }
  .g3d-card-subtitle {
    font-size: var(--g3d-text-xs);
  }
}
/* 360px and bigger - breakpoint xs */
@container g3d-card-cq (width >= 360px) {
  .g3d-card {
    --space: 1.6rem;
    --card-radius: 18px;
  }
  .g3d-card-title-group {
    gap: 0.4em;
  }
  .g3d-card-title-lg {
    font-size: 7.75cqw;
  }
  .g3d-card-title-md {
    font-size: 6cqw;
  }
  .g3d-card-subtitle {
    font-size: var(--g3d-text-sm);
  }
}
/* 488px and bigger - breakpoint sm */
@container g3d-card-cq (width >= 488px) {
  .g3d-card {
    --space: 2.2rem;
    --card-radius: 1.4rem;
  }
  .g3d-card-title-group {
    gap: 0.6rem;
  }
  .g3d-card-padding-top {
    padding-top: var(--g3d-xs);
  }
  .g3d-card-title-lg {
    font-size: 7cqw;
  }
  .g3d-card-title-md {
    font-size: 6cqw;
  }
  .g3d-card-subtitle {
    font-size: var(--g3d-text-xs);
  }
}
/* 768px and bigger - breakpoint md */
@container g3d-card-cq (width >= 768px) {
  .g3d-card {
    --space: 1.8rem;
    --card-radius: 1.5rem;
  }
  .g3d-card-title-group {
    gap: 0.75em;
  }
  .g3d-card-title-lg {
    font-size: 6cqw;
  }
  .g3d-card-title-md {
    font-size: var(--g3d-text-lg);
  }
  .g3d-card-subtitle {
    font-size: var(--g3d-text-md);
  }
}
/* 1024px and bigger - breakpoint lg */
@container g3d-card-cq (width >= 1024px) {
  .g3d-card {
    --space: 4cqw;
    --card-radius: 2.5cqw;
  }
  .g3d-card-title-lg {
    font-size: 5cqw;
  }
  .g3d-card-title-md {
    font-size: var(--g3d-text-lg);
  }
  .g3d-card-subtitle {
    font-size: var(--g3d-text-xs);
  }
}
/* 1440px and bigger - breakpoint xl */
@container g3d-card-cq (width >= 1440px) {
  .g3d-card {
    --space: 3.75cqw;
    --card-radius: 2.25cqw;
  }
  .g3d-card-title-group {
    gap: 0.5rem;
  }
  .g3d-card-title-lg {
    font-size: min(4cqw, 70px);
  }
  .g3d-card-title-md {
    font-size: var(--g3d-text-lg);
  }
  .g3d-card-subtitle {
    font-size: var(--g3d-text-xs);
  }
}
/* 1920px and bigger - breakpoint 2xl */
@container g3d-card-cq (width >= 1920px) {
  .g3d-card {
    --space: 3.5cqw;
    --card-radius: 2cqw;
  }
  .g3d-card-title-group {
    gap: 0.5rem;
  }
  .g3d-card-title-lg {
    font-size: min(4cqw, 70px);
  }
  .g3d-card-title-md {
    font-size: var(--g3d-text-lg);
  }
  .g3d-card-subtitle {
    font-size: var(--g3d-text-xs);
  }
}
/* Switch to a e2e-bevel at 100vw or bigger to remove the left edge bevel */
@container g3d-card-cq (width >= 99vw ) {
  .g3d-card,
  .g3d-card-fit-compact,
  .g3d-card-fit-roomy {
    --card-radius: 0;
  }
  .g3d-card.g3d-glass-base-3d,
  .g3d-card-fit-compact.g3d-glass-base-3d,
  .g3d-card-fit-roomy.g3d-glass-base-3d {
    border-radius: 0;
  }
  .g3d-card.g3d-glass-base-3d::after,
  .g3d-card-fit-compact.g3d-glass-base-3d::after,
  .g3d-card-fit-roomy.g3d-glass-base-3d::after {
    box-shadow: var(--g3d-e2e-bevel-2xl);
  }
}
/* ================================================== */
/* Modifications for g3d components */
/* too small for their own page */
/* ================================================== */
.g3d-marquee-bg {
  --_g3d-glass-z: var(--g3d-glass-z, 1);
  /* Background color HSL */
  --_g3d-glass-h: var(--g3d-glass-h, 203);
  --_g3d-glass-s: var(--g3d-glass-s, 70%);
  --_g3d-glass-l: var(--g3d-glass-l, 50%);
  --_g3d-glass-a: var(--g3d-glass-a, 0.1);
  /* Backdrop filter */
  --_g3d-glass-blur: var(--g3d-glass-blur, 16px);
  --_g3d-glass-saturate: var(--g3d-glass-saturate, 1.5);
  --_g3d-glass-brightness: var(--g3d-glass-brightness, 1.1);
  /* Glass texture */
  --_g3d-glass-texture-img: var(
    --g3d-glass-texture-img,
    var(--g3d-texture-egg-shell)
  );
  --_g3d-glass-texture-size: var(
    --g3d-glass-texture-size,
    var(--g3d-texture-lg)
  );
  /* Glass bevel */
  --_g3d-glass-bevel: var(--g3d-glass-bevel, var(--g3d-bevel-2xl));
  position: relative;
  z-index: var(--_g3d-glass-z);
  isolation: isolate;
}
.g3d-marquee-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) - 1);
  backdrop-filter: blur(var(--_g3d-glass-blur)) brightness(var(--_g3d-glass-brightness)) saturate(var(--_g3d-glass-saturate));
  background-color: hsl(var(--_g3d-glass-h), var(--_g3d-glass-s), var(--_g3d-glass-l), max(var(--_g3d-glass-a), 0.01));
  background-image: var(--_g3d-glass-texture-img);
  background-size: var(--_g3d-glass-texture-size);
  background-repeat: repeat;
}
.g3d-marquee-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) + 1);
  box-shadow: var(--_g3d-glass-bevel);
}
.g3d-marquee-bg > * {
  position: relative;
  z-index: calc(var(--_g3d-glass-z, 1) + 3);
}
.g3d-marquee-bg {
  --g3d-glass-z: 1;
  /* Background color HSL */
  --g3d-glass-h: var(--g3d-secondary-h);
  --g3d-glass-s: 90%;
  --g3d-glass-l: 95%;
  --g3d-glass-a: 0.25;
  /* Backdrop filter */
  --g3d-glass-blur: 18px;
  --g3d-glass-saturate: 1.5;
  --g3d-glass-brightness: 1.05;
  /* Glass texture */
  --g3d-glass-texture-img: var(--g3d-texture-egg-shell);
  --g3d-glass-texture-size: var(--g3d-texture-lg);
  /* Glass bevel */
}
.g3d-marquee-bg::after {
  box-shadow: var(--g3d-e2e-bevel-md);
}

.g3d-marquee-title {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-min-content;
  height: min-content;
  font-family: var(--g3d-font-display);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-xl);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: 100%;
  text-align: end;
  margin-bottom: -0.3rem;
}
@media (width >= 22.5rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-2xl);
  }
}
@media (width >= 30.5rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-3xl);
    margin-bottom: -0.4rem;
  }
}
@media (width >= 48rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-4xl);
    margin-bottom: -0.5rem;
  }
}
@media (width >= 80rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-5xl);
  }
}
@media (width >= 90rem) {
  .g3d-marquee-title {
    font-size: var(--g3d-text-6xl);
  }
}

/* ================================================== */
/* Aggregate Partials SCSS */
/* ================================================== */
/* ================================================== */
/* Main Nav */
/* ================================================== */
/* Edit color tokens in `/brand-tokens/_brand-colors.scss` */
:root {
  --g3d-nav-padding: var(--g3d-3xs);
  --g3d-nav-item-h: var(--g3d-ui-h-md);
  /* Nav height value is used for several layout calculations and to set `scroll-padding-top` */
  --g3d-nav-height: calc(var(--g3d-nav-item-h) + (var(--g3d-nav-padding) * 2));
}

@media (width >= 30.5rem) {
  :root {
    --g3d-nav-padding: var(--g3d-2xs);
  }
}
@media (width >= 48rem) {
  :root {
    --g3d-nav-padding: var(--g3d-xs);
  }
}
/* -area */
/* ================================================== */
.g3d-nav-area {
  position: relative;
  z-index: var(--g3d-z-nav);
  width: 100%;
  height: var(--g3d-nav-height);
}

/* -wrap */
/* ================================================== */
.g3d-nav-wrap {
  position: fixed;
  inset: 0;
  z-index: var(--g3d-z-nav);
  height: var(--g3d-nav-height);
  padding: 0;
  display: grid;
  place-items: center;
}

/* -bg */
/* ================================================== */
.g3d-nav-bg {
  z-index: var(--g3d-z-nav);
  width: 100%;
  --_g3d-glass-z: var(--g3d-glass-z, 1);
  /* Background color HSL */
  --_g3d-glass-h: var(--g3d-glass-h, 203);
  --_g3d-glass-s: var(--g3d-glass-s, 70%);
  --_g3d-glass-l: var(--g3d-glass-l, 50%);
  --_g3d-glass-a: var(--g3d-glass-a, 0.1);
  /* Backdrop filter */
  --_g3d-glass-blur: var(--g3d-glass-blur, 16px);
  --_g3d-glass-saturate: var(--g3d-glass-saturate, 1.5);
  --_g3d-glass-brightness: var(--g3d-glass-brightness, 1.1);
  /* Glass texture */
  --_g3d-glass-texture-img: var(
    --g3d-glass-texture-img,
    var(--g3d-texture-egg-shell)
  );
  --_g3d-glass-texture-size: var(
    --g3d-glass-texture-size,
    var(--g3d-texture-lg)
  );
  /* Glass bevel */
  --_g3d-glass-bevel: var(--g3d-glass-bevel, var(--g3d-bevel-2xl));
  position: relative;
  z-index: var(--_g3d-glass-z);
  isolation: isolate;
}
.g3d-nav-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) - 1);
  backdrop-filter: blur(var(--_g3d-glass-blur)) brightness(var(--_g3d-glass-brightness)) saturate(var(--_g3d-glass-saturate));
  background-color: hsl(var(--_g3d-glass-h), var(--_g3d-glass-s), var(--_g3d-glass-l), max(var(--_g3d-glass-a), 0.01));
  background-image: var(--_g3d-glass-texture-img);
  background-size: var(--_g3d-glass-texture-size);
  background-repeat: repeat;
}
.g3d-nav-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) + 1);
  box-shadow: var(--_g3d-glass-bevel);
}
.g3d-nav-bg > * {
  position: relative;
  z-index: calc(var(--_g3d-glass-z, 1) + 3);
}
.g3d-nav-bg {
  --g3d-glass-z: 1;
  /* Background color HSL */
  --g3d-glass-h: var(--g3d-secondary-h);
  --g3d-glass-s: 90%;
  --g3d-glass-l: 95%;
  --g3d-glass-a: 0.25;
  /* Backdrop filter */
  --g3d-glass-blur: 18px;
  --g3d-glass-saturate: 1.5;
  --g3d-glass-brightness: 1.05;
  /* Glass texture */
  --g3d-glass-texture-img: var(--g3d-texture-egg-shell);
  --g3d-glass-texture-size: var(--g3d-texture-lg);
  /* Glass bevel */
}
.g3d-nav-bg::after {
  box-shadow: var(--g3d-bevel-none);
}
.g3d-nav-bg {
  box-shadow: var(--g3d-shadow-xl);
  border-radius: 0;
}

/* -layout */
/* ================================================== */
.g3d-nav-layout {
  width: var(--g3d-width-minus-moat);
  max-width: var(--g3d-general-max-width);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: var(--g3d-nav-padding) 0;
  margin: auto;
}

/* -desktop & -dropdown */
/* ================================================== */
.g3d-desktop-menu-layout {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: -moz-fit-content;
  width: fit-content;
  gap: var(--g3d-sm);
}
@media (width >= 48rem) {
  .g3d-desktop-menu-layout {
    gap: var(--g3d-md);
  }
}
@media (width >= 64rem) {
  .g3d-desktop-menu-layout {
    gap: var(--g3d-xl);
  }
}

/* -logo */
/* ================================================== */
.g3d-nav-logo-btn {
  width: var(--g3d-nav-item-h);
  display: grid;
  place-items: center;
}

.g3d-nav-logo {
  width: auto;
  height: var(--g3d-nav-item-h);
  opacity: 1;
}

/* -nav-link */
/* ================================================== */
.g3d-nav-link {
  pointer-events: auto;
  text-decoration: none;
}

.g3d-nav-link-text {
  text-decoration: none;
  font-size: var(--g3d-text-xs);
  font-weight: var(--g3d-font-weight-sm);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: 1;
  text-shadow: var(--g3d-text-shadow-xs);
  color: var(--g3d-nav-link-text-color);
  will-change: color;
  transition: color var(--g3d-speed-base) var(--g3d-smooth-cubic);
}
@media (width >= 48rem) {
  .g3d-nav-link-text {
    font-size: var(--g3d-text-sm);
  }
}

.g3d-nav-social {
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  align-content: center;
  gap: var(--g3d-xs);
}
.g3d-nav-social svg {
  background-color: var(--g3d-nav-link-text-color);
}

/* nav-link:hover */
/* ================================================== */
@media (hover: hover) {
  .g3d-nav-link:hover .g3d-nav-link-text {
    color: var(--g3d-nav-link-text-color-hover);
  }
  .g3d-nav-link:hover .g3d-nav-social svg {
    background-color: var(--g3d-nav-link-text-color-hover);
  }
}
/* ================================================== */
/* Dropdown-menu */
/* ================================================== */
/* wrapper class for positioning open dropdown menu relative to toggle */
.g3d-dropdown-position {
  position: relative;
  display: flex;
  justify-content: flex-end;
}

/* -toggle */
.g3d-dropdown-toggle {
  pointer-events: auto;
}
.g3d-dropdown-toggle > .g3d-is-closed-icon {
  display: inline-block;
}
.g3d-dropdown-toggle > .g3d-is-open-icon {
  display: none;
}

.g3d-dropdown-toggle.is-open > .g3d-is-closed-icon {
  display: none;
}
.g3d-dropdown-toggle.is-open > .g3d-is-open-icon {
  display: inline-block;
}

/* -menu */
.g3d-dropdown-menu {
  --toggle-height: 0px; /* height value set via g3d-dropdown.ts */
  --menu-width: 0px; /* width value set via g3d-dropdown.ts */
  --top-offset: calc(var(--toggle-height) + var(--g3d-sm));
  pointer-events: none;
  position: absolute !important;
  top: var(--top-offset);
  z-index: var(--g3d-z-dropdown);
  min-width: 8rem;
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-items: center;
  gap: var(--g3d-3xs);
  padding: var(--g3d-2xs);
  --_g3d-glass-z: var(--g3d-glass-z, 1);
  /* Background color HSL */
  --_g3d-glass-h: var(--g3d-glass-h, 203);
  --_g3d-glass-s: var(--g3d-glass-s, 70%);
  --_g3d-glass-l: var(--g3d-glass-l, 50%);
  --_g3d-glass-a: var(--g3d-glass-a, 0.1);
  /* Backdrop filter */
  --_g3d-glass-blur: var(--g3d-glass-blur, 16px);
  --_g3d-glass-saturate: var(--g3d-glass-saturate, 1.5);
  --_g3d-glass-brightness: var(--g3d-glass-brightness, 1.1);
  /* Glass texture */
  --_g3d-glass-texture-img: var(
    --g3d-glass-texture-img,
    var(--g3d-texture-egg-shell)
  );
  --_g3d-glass-texture-size: var(
    --g3d-glass-texture-size,
    var(--g3d-texture-lg)
  );
  /* Glass bevel */
  --_g3d-glass-bevel: var(--g3d-glass-bevel, var(--g3d-bevel-2xl));
  position: relative;
  z-index: var(--_g3d-glass-z);
  isolation: isolate;
}
.g3d-dropdown-menu::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) - 1);
  backdrop-filter: blur(var(--_g3d-glass-blur)) brightness(var(--_g3d-glass-brightness)) saturate(var(--_g3d-glass-saturate));
  background-color: hsl(var(--_g3d-glass-h), var(--_g3d-glass-s), var(--_g3d-glass-l), max(var(--_g3d-glass-a), 0.01));
  background-image: var(--_g3d-glass-texture-img);
  background-size: var(--_g3d-glass-texture-size);
  background-repeat: repeat;
}
.g3d-dropdown-menu::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  z-index: calc(var(--_g3d-glass-z) + 1);
  box-shadow: var(--_g3d-glass-bevel);
}
.g3d-dropdown-menu > * {
  position: relative;
  z-index: calc(var(--_g3d-glass-z, 1) + 3);
}
.g3d-dropdown-menu {
  --g3d-glass-z: 1;
  /* Background color HSL */
  --g3d-glass-h: var(--g3d-secondary-h);
  --g3d-glass-s: 90%;
  --g3d-glass-l: 95%;
  --g3d-glass-a: 0.25;
  /* Backdrop filter */
  --g3d-glass-blur: 8px;
  --g3d-glass-saturate: 1.5;
  --g3d-glass-brightness: 1.05;
  /* Glass texture */
  --g3d-glass-texture-img: var(--g3d-texture-egg-shell);
  --g3d-glass-texture-size: var(--g3d-texture-md);
  /* Glass bevel */
}
.g3d-dropdown-menu::after {
  box-shadow: var(--g3d-bevel-lg);
}
.g3d-dropdown-menu {
  border-radius: var(--g3d-3xs);
  box-shadow: var(--g3d-shadow-xl);
  opacity: 0;
  transition: opacity var(--g3d-speed-fast) var(--g3d-smooth-cubic);
}
.g3d-dropdown-menu.g3d-left-of-toggle {
  left: calc(-1 * (var(--menu-width) - var(--toggle-height)));
}
.g3d-dropdown-menu.g3d-right-of-toggle {
  left: 0;
}
.g3d-dropdown-menu.g3d-center-of-toggle {
  left: calc(-1 * (var(--menu-width) - var(--toggle-height)) / 2);
}

.g3d-dropdown-menu.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* -item */
.g3d-dropdown-item {
  min-width: -moz-max-content;
  min-width: max-content;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 4px 0;
  background-color: hsl(var(--g3d-primary-hs) 95%/0.05);
  transition: background-color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  border-radius: 0.5rem;
}

.g3d-dropdown-menu .g3d-dropdown-item {
  pointer-events: none;
}

.g3d-dropdown-menu.is-open .g3d-dropdown-item {
  pointer-events: auto;
}

/* -text */
.g3d-dropdown-item-text {
  color: var(--g3d-dropdown-item-text-color);
  transition: color var(--g3d-speed-base) var(--g3d-smooth-cubic);
}

@media (hover: hover) {
  .g3d-dropdown-item:hover {
    background-color: var(--g3d-dropdown-item-bg-hover);
  }
  .g3d-dropdown-item:hover .g3d-dropdown-item-text {
    color: var(--g3d-dropdown-item-text-color-hover);
  }
}
/* ================================================== */
/* Main Footer */
/* ================================================== */
.g3d-footer-area {
  z-index: var(--g3d-z-footer);
  position: relative;
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-items: end center;
  background-color: var(--g3d-footer-bg-color);
}

.g3d-footer-layout {
  width: var(--g3d-width-minus-moat);
  max-width: var(--g3d-general-max-width);
  height: -moz-fit-content;
  height: fit-content;
  margin: auto;
  --footer-space: 1rem;
}
@media (width >= 48rem) {
  .g3d-footer-layout {
    --footer-space: 1.25rem;
  }
}
@media (width >= 64rem) {
  .g3d-footer-layout {
    --footer-space: 1.5rem;
  }
}

/* upper */
/* ================================================== */
.g3d-footer-upper {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1.25rem;
  padding: var(--footer-space) 0;
  border-bottom: 1px solid var(--g3d-footer-divider-color);
}

.footer-tagline-group > :first-child {
  font-size: calc(var(--g3d-text-md) * 0.6);
}
.footer-tagline-group > :nth-child(2) {
  font-size: calc(var(--g3d-text-md) * 0.8);
}
.footer-tagline-group > :last-child {
  font-size: calc(var(--g3d-text-md) * 1);
}
@media (width >= 30.5rem) {
  .footer-tagline-group > :first-child {
    font-size: calc(var(--g3d-text-md) * 0.65);
  }
  .footer-tagline-group > :nth-child(2) {
    font-size: calc(var(--g3d-text-md) * 0.85);
  }
  .footer-tagline-group > :last-child {
    font-size: calc(var(--g3d-text-md) * 1.1);
  }
}
@media (width >= 64rem) {
  .footer-tagline-group > :first-child {
    font-size: calc(var(--g3d-text-md) * 0.75);
  }
  .footer-tagline-group > :nth-child(2) {
    font-size: calc(var(--g3d-text-md) * 1);
  }
  .footer-tagline-group > :last-child {
    font-size: calc(var(--g3d-text-md) * 1.2);
  }
}

.footer-tagline {
  width: -moz-fit-content;
  width: fit-content;
  font-family: var(--g3d-font-title);
  font-weight: var(--g3d-font-weight-md);
  letter-spacing: var(--g3d-letter-spacing-md);
  line-height: var(--g3d-line-height-md);
  color: var(--g3d-font-color-inverse-strong);
}

/* email */
/* ================================================== */
.g3d-footer-email-group {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-items: end;
  gap: var(--g3d-4xs);
}
@media (width >= 48rem) {
  .g3d-footer-email-group {
    gap: var(--g3d-3xs);
  }
}

.g3d-footer-email-label {
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-3xs);
  letter-spacing: var(--g3d-letter-spacing-md);
  color: var(--g3d-font-color-inverse-strong);
}
@media (width >= 48rem) {
  .g3d-footer-email-label {
    font-size: var(--g3d-text-2xs);
  }
}
@media (width >= 64rem) {
  .g3d-footer-email-label {
    font-size: var(--g3d-text-xs);
  }
}

.g3d-footer-email {
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-xs);
  letter-spacing: var(--g3d-letter-spacing-md);
  text-decoration: underline;
  text-underline-offset: 3px;
  color: var(--g3d-footer-link-color);
  will-change: color;
  transition: color var(--g3d-speed-base) var(--g3d-smooth-cubic);
  padding-bottom: 4px;
}
.g3d-footer-email:hover {
  color: var(--g3d-footer-link-color-hover);
}
@media (width >= 48rem) {
  .g3d-footer-email {
    font-size: var(--g3d-text-sm);
  }
}

/* lower */
/* ================================================== */
.g3d-footer-lower {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-content: center;
  padding: 0.75rem 0;
}

/* ================================================== */
/* Aggregate Pages SCSS */
/* ================================================== */
/* ================================================== */
/* Global styles */
/* ================================================== */
/* debug */
/* ================================================== */
.debug {
  outline: 1px solid red;
}

/* ================================================== */
/* Page transition animation */
#content {
  opacity: 1;
  transition: opacity var(--g3d-speed-slow) var(--g3d-smooth-cubic);
}

#content.is-fading {
  opacity: 0;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  #content {
    transition: none;
  }
}
/* Page skeleton  */
.g3d-page-area {
  position: relative;
  z-index: var(--g3d-z-page-content);
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  min-height: 100vh;
  display: grid;
  grid-template-areas: "nav" "main" "footer";
  grid-template-rows: var(--g3d-nav-height) 1fr auto;
  color: var(--g3d-text-color-base);
  /* Backdrop overlay  */
  background-color: #852913;
  scroll-padding-top: var(--g3d-nav-height);
}
.g3d-page-area .g3d-nav-area {
  grid-area: nav;
  place-self: start center;
}
.g3d-page-area .g3d-content-area {
  width: 100%;
  grid-area: main;
  display: grid;
}
.g3d-page-area .g3d-footer-area {
  grid-area: footer;
  place-self: end center;
}

.g3d-anchor {
  display: block;
  height: 1px;
  pointer-events: none;
}

/* ================================================== */
/* Case study Hero */
/* ================================================== */
/* Case study hero layout */
/* ================================================== */
.cs-hero-layout {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto;
  grid-template-areas: "title" "img" "card";
  text-shadow: var(--g3d-text-shadow-sm);
}
.cs-hero-layout > .cs-hero-title-bin {
  grid-area: title;
}
.cs-hero-layout > .cs-hero-card-bin {
  grid-area: card;
  place-self: start end;
}
.cs-hero-layout > .cs-hero-img-bin {
  grid-area: img;
}

@media (width >= 64rem) {
  .cs-hero-layout {
    grid-template-columns: 5fr 1fr 1fr;
    grid-template-areas: "title img-card card" "img img-card card";
  }
  .cs-hero-layout > .cs-hero-title-bin {
    grid-area: title;
  }
  .cs-hero-layout > .cs-hero-card-bin {
    grid-column: img-card/card;
    grid-row: 1/3;
    place-self: start;
  }
  .cs-hero-layout > .cs-hero-img-bin {
    grid-column: img/img-card;
    grid-row: 2/3;
  }
}
@media (width >= 90rem) {
  .cs-hero-layout {
    grid-template-columns: 5fr 2fr 1fr;
  }
}
/* Hero title */
/* ================================================== */
.cs-hero-title-bin {
  width: 100%;
  padding: 0 var(--g3d-moat) var(--g3d-md) var(--g3d-moat);
}

@media (width >= 30.5rem) {
  .cs-hero-title-bin {
    padding: 0 0 var(--g3d-lg) var(--g3d-moat);
  }
}
@media (width >= 48rem) {
  .cs-hero-title-bin {
    padding: 0 0 var(--g3d-lg) 0;
  }
}
@media (width >= 64rem) {
  .cs-hero-title-bin {
    padding: 0 1rem var(--g3d-xl) 0;
  }
}
.cs-hero-title {
  max-width: 600px;
  font-family: var(--g3d-font-title);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-3xl);
  letter-spacing: var(--g3d-letter-spacing-2xs);
  line-height: var(--g3d-line-height-2xs);
  color: #021222;
}
@media (width >= 30.5rem) {
  .cs-hero-title {
    font-size: var(--g3d-text-4xl);
  }
}
@media (width >= 64rem) {
  .cs-hero-title {
    max-width: 100%;
    font-size: var(--g3d-text-6xl);
  }
}
@media (width >= 80rem) {
  .cs-hero-title {
    font-size: var(--g3d-text-7xl);
  }
}

/* Hero Card */
/* ================================================== */
.cs-hero-card-bin {
  max-width: 100%;
  height: -moz-fit-content;
  height: fit-content;
}

@media (width >= 48rem) {
  .cs-hero-card-bin {
    max-width: 670px;
    margin-top: -3rem;
  }
}
@media (width >= 64rem) {
  .cs-hero-card-bin {
    max-width: 300px;
    margin-top: 1rem;
  }
}
.cs-hero-card-bg {
  box-shadow: var(--sha-xl);
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
}

.cs-hero-card-spacing {
  display: flex;
  flex-wrap: wrap;
  gap: var(--g3d-lg);
  justify-content: space-between;
}

@media (width >= 64rem) {
  .cs-hero-card-spacing {
    display: grid;
    gap: var(--g3d-xl);
  }
}
/* Hero img */
/* ================================================== */
.cs-hero-img-bin {
  border-radius: max(0px, min(var(--g3d-sm), (100vw - 15px - 100%) * 9999))/var(--g3d-sm);
  z-index: var(--g3d-z-surface);
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background-color: hsl(var(--g3d-primary-h), 90%, 99%);
  background-image: var(--g3d-paper-texture-img);
  background-size: var(--g3d-paper-texture-size);
  background-repeat: repeat;
  box-shadow: var(--g3d-shadow-sm);
}

@media (width >= 30.5rem) {
  .cs-hero-img-bin {
    aspect-ratio: 8/5;
  }
}
@media (width >= 48rem) {
  .cs-hero-img-bin {
    max-width: 720px;
  }
}
@media (width >= 64rem) {
  .cs-hero-img-bin {
    max-width: 800px;
  }
}
.cs-hero-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: left top;
     object-position: left top;
}

.bulletpoint-group {
  width: -moz-fit-content;
  width: fit-content;
}

.bulletpoint-group-title {
  width: -moz-fit-content;
  width: fit-content;
  font-family: var(--g3d-font-title);
  font-weight: 600;
  font-size: var(--g3d-text-xs);
  letter-spacing: 0.17em;
  line-height: var(--g3d-line-height-md);
  text-shadow: var(--g3d-text-shadow-xs);
  text-transform: uppercase;
  color: var(--g3d-font-color-accent-strong);
}

.bulletpoint-list {
  width: -moz-fit-content;
  width: fit-content;
  display: grid;
  gap: var(--g3d-5xs);
  padding-top: var(--g3d-2xs);
}

.bulletpoint-text {
  font-family: var(--g3d-font-title);
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-sm);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: var(--g3d-line-height-md);
}

/* ================================================== */
/* Case study page */
/* ================================================== */
/* debug */
.case-study-page {
  display: grid;
  gap: 8rem;
  padding-top: var(--g3d-4xl);
  padding-bottom: var(--g3d-8xl);
}

@media (width >= 48rem) {
  .case-study-page {
    padding-top: 8rem;
  }
}
@media (width >= 64rem) {
  .case-study-page {
    padding-top: 10rem;
  }
}
@media (width >= 80rem) {
  .case-study-page {
    padding-top: 12rem;
  }
}
.cs-main-bg {
  --part-text-w: var(--g3d-w-lg);
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  background-color: hsl(var(--g3d-neutral-hs) 95%/1);
}

/* Case study part */
/* ================================================== */
@media (width >= 30.5rem) {
  .cs-part-spacing {
    padding: 7em 0;
  }
}
.cs-part-layout-center {
  max-width: 100%;
  display: grid;
  padding: 4em 0;
  gap: var(--g3d-xl);
  place-items: center;
}

.cs-part-layout-start {
  max-width: 100%;
  display: grid;
  padding: 4em 0;
  gap: var(--g3d-xl);
  place-items: center start;
}

.cs-part-layout-end {
  max-width: 100%;
  display: grid;
  padding: 4em 0;
  gap: var(--g3d-xl);
  place-items: center end;
}

.cs-part-2 {
  max-width: 100%;
  display: grid;
  padding: 4em 0;
  gap: var(--g3d-xl);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

.cs-part-2-right {
  max-width: 100%;
  display: grid;
  padding: 4em 0;
  gap: var(--g3d-xl);
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}

@media (width >= 80rem) {
  .cs-part-2-right {
    justify-content: space-around;
  }
}
.cs-part-title-group {
  max-width: var(--part-text-w);
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  row-gap: var(--g3d-3xs);
  grid-template-columns: var(--g3d-sm) 1fr;
  grid-auto-rows: auto;
}
.cs-part-title-group > .cs-part-title {
  grid-column: 1/3;
}
.cs-part-title-group > :nth-child(2) {
  grid-column: 2/3;
}

@media (width >= 30.5rem) {
  .cs-part-title-group {
    row-gap: var(--g3d-xs);
    grid-template-columns: var(--g3d-lg) 1fr;
  }
}
.cs-part-title {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  font-family: var(--g3d-font-title);
  font-weight: 500;
  font-size: var(--g3d-text-xs);
  letter-spacing: var(--g3d-letter-spacing-xl);
  line-height: var(--g3d-line-height-md);
  text-shadow: var(--g3d-text-shadow-2xs);
  text-transform: uppercase;
  color: var(--g3d-font-color-accent-base);
}

.cs-part-blurb {
  max-width: 100%;
  font-size: var(--g3d-text-md);
  line-height: var(--g3d-line-height-sm);
  font-weight: var(--g3d-font-weight-lg);
  color: var(--g3d-text-color-xstrong);
}

.cs-body-text {
  max-width: 100%;
  font-size: var(--g3d-text-sm);
  line-height: 1.42;
  font-weight: var(--g3d-font-weight-md);
  color: var(--g3d-text-color-base);
}

.img-layout-overlap-top {
  position: relative;
  z-index: var(--g3d-z-card);
  margin-top: 0;
  padding-top: var(--g3d-2xl);
}

@media (width >= 64rem) {
  .img-layout-overlap-top {
    margin-top: -7em;
    padding-top: 0;
  }
}
.cs-bulletpoint-group {
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--g3d-3xs);
}

.cs-bulletpoint-group-title {
  font-family: var(--g3d-font-title);
  font-weight: var(--g3d-font-weight-lg);
  font-size: var(--g3d-text-lg);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: var(--g3d-line-height-md);
  text-shadow: var(--g3d-text-shadow-xs);
  color: var(--g3d-text-color-xstrong);
}

.cs-bulletpoint-list {
  display: grid;
  gap: var(--g3d-2xs);
}

.cs-bulletpoint-text {
  max-width: 100%;
  width: -moz-fit-content;
  width: fit-content;
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-sm);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: var(--g3d-line-height-md);
  color: var(--g3d-text-color-base);
  padding-left: 1em;
}
.cs-bulletpoint-text::before {
  content: "✺";
  color: hsl(var(--g3d-accent-hs) 45%/1);
  padding-right: 0.5em;
}

.cs-subtitle {
  font-family: var(--g3d-font-title);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-md);
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: var(--g3d-line-height-sm);
  text-shadow: var(--g3d-text-shadow-xs);
  color: var(--g3d-text-color-strong);
}

.cs-part-text-w {
  max-width: var(--part-text-w);
}

.g3d-2-flex-col {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  row-gap: var(--g3d-3xl);
  -moz-column-gap: var(--g3d-sm);
       column-gap: var(--g3d-sm);
}

/* ================================================== */
/* Home */
/* ================================================== */
.home-intro-layout {
  position: relative;
  max-width: var(--g3d-general-max-width);
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  place-items: start center;
  padding: 4rem 0 2rem 0;
}

.hero-layout-2-1 {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  gap: var(--g3d-lg);
}
@media (width >= 64rem) {
  .hero-layout-2-1 {
    grid-template-columns: 2fr 1fr;
    gap: var(--g3d-5xl);
    place-items: end center;
  }
}

.hero-intro-group {
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: 0.2rem;
  place-items: start end;
}

.hero-title {
  font-family: var(--g3d-font-display);
  font-weight: 400;
  font-size: 3.7rem;
  letter-spacing: var(--g3d-letter-spacing-xs);
  line-height: 1;
  text-align: end;
  color: #021222;
  text-shadow: var(--g3d-text-shadow-2xs);
}
@media (width >= 30.5rem) {
  .hero-title {
    font-size: 4.4rem;
  }
}

.hero-name {
  font-family: var(--g3d-font-title);
  font-weight: 300;
  font-size: 1.6rem;
  letter-spacing: var(--g3d-letter-spacing-md);
  line-height: 1;
  text-align: end;
  color: #021222;
  text-shadow: var(--g3d-text-shadow-2xs);
}
@media (width >= 30.5rem) {
  .hero-name {
    font-size: 2rem;
  }
}

.hero-text {
  font-family: var(--g3d-font-title);
  font-weight: 200;
  font-size: 0.7rem;
  letter-spacing: var(--g3d-letter-spacing-md);
  line-height: 1;
  text-align: end;
  color: #021222;
  text-shadow: var(--g3d-text-shadow-xs);
  padding-top: 0.5rem;
}
@media (width >= 30.5rem) {
  .hero-text {
    font-size: 0.9rem;
  }
}

.intro-img {
  width: 100%;
  max-width: 800px;
  place-self: start;
}

/* ================================================== */
/* Stream log */
/* ================================================== */
.stream-title-group {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  gap: var(--g3d-3xs);
}
@media (width >= 64rem) {
  .stream-title-group {
    gap: var(--g3d-3xs);
  }
}

.stream-title {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-min-content;
  height: min-content;
  font-family: var(--g3d-font-display);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-xl);
  letter-spacing: var(--g3d-letter-spacing-sm);
  line-height: 100%;
  text-align: end;
  text-shadow: var(--g3d-text-shadow-sm);
  color: var(--g3d-text-color-strong);
}
@media (width >= 22.5rem) {
  .stream-title {
    font-size: var(--g3d-text-2xl);
  }
}
@media (width >= 30.5rem) {
  .stream-title {
    font-size: var(--g3d-text-3xl);
  }
}
@media (width >= 48rem) {
  .stream-title {
    font-size: var(--g3d-text-4xl);
  }
}
@media (width >= 80rem) {
  .stream-title {
    font-size: var(--g3d-text-5xl);
  }
}
@media (width >= 90rem) {
  .stream-title {
    font-size: var(--g3d-text-6xl);
  }
}

.stream-subtitle {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-xs);
  line-height: var(--g3d-line-height-sm);
}
@media (width >= 30.5rem) {
  .stream-subtitle {
    font-size: var(--g3d-text-sm);
  }
}
@media (width >= 64rem) {
  .stream-subtitle {
    font-size: var(--g3d-text-md);
  }
}

.stream-time {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-sm);
  font-size: var(--g3d-text-xs);
  line-height: var(--g3d-line-height-sm);
  color: var(--g3d-text-color-mild);
}

.stream-text {
  font-family: var(--g3d-font-body);
  font-weight: var(--g3d-font-weight-md);
  font-size: var(--g3d-text-sm);
  line-height: var(--g3d-line-height-sm);
  color: var(--g3d-text-color-base);
}

.stream-log-entry {
  display: grid;
  gap: 1rem;
  place-items: start;
}

.stream-img {
  place-self: center;
  max-width: 100%;
}