/* src/app/style/animation.scss */
@keyframes rotation {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes appear {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes marquee {
  0% {
    transform: translate3d(100cqw, 0, 0);
  }
  100% {
    transform: translate3d(-100%, 0, 0);
  }
}

/* src/app/style/button.scss */
.rbtn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  min-width: 40px;
  height: 40px;
  padding: 0;
  margin: 0;
  appearance: none;
  background: none;
  border: none;
  border-radius: 20px;
  color: var(--color-content);
  font-size: 20px;
  text-decoration: none;
  -webkit-user-select: none;
  user-select: none;
  transition:
    background-color 0.3s,
    transform 0.3s,
    color 0s;
  cursor: pointer;
}
.rbtn::after {
  display: none;
  font-family: "fa-light";
}
@media (hover: hover) and (pointer: fine) {
  .rbtn:hover {
    background-color: var(--color-content);
    color: var(--color-invert);
    transform: translateY(2px);
  }
}
.rbtn span {
  pointer-events: none;
}
.rbtn span::before {
  font-family: "fa-light";
}
.rbtn.close span::before {
  content: "\f00d";
}
.rbtn.left span::before {
  content: "\f053";
}
.rbtn.right span::before {
  content: "\f054";
}
.rbtn.compact {
  width: 30px;
  min-width: 30px;
  height: 30px;
  font-size: 18px;
}
.rbtn.disabled {
  color: var(--color-neutral);
  pointer-events: none;
}
.sbtn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 30px;
  padding: 0 15px;
  margin: 0;
  border-radius: 20px;
  border: 1px var(--color-content) solid;
  background: none;
  color: var(--color-content);
  font-size: 12px;
  text-transform: uppercase;
  text-decoration: none;
  transition:
    background-color 0.3s,
    transform 0.3s,
    color 0s;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
  .sbtn:hover {
    background-color: var(--color-content);
    color: var(--color-invert);
    transform: translateY(2px);
  }
}
.sbtn::after {
  position: absolute;
  left: 0;
  top: 0;
  display: none;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
  font-family: "fa-light";
}
.sbtn span {
  pointer-events: none;
  transition: 0.3s;
}
.sbtn.active {
  background-color: var(--color-content);
  color: var(--color-invert);
}
.sbtn.busy {
  background-color: var(--color-content);
  color: var(--color-invert);
  pointer-events: none;
}
.sbtn.busy span {
  opacity: 0;
}
.sbtn.busy::after {
  display: flex;
  content: "\f3f4";
  animation: rotation 1s linear 0s infinite;
}
.sbtn.imagable {
  height: 40px;
}
.sbtn.imagable:has(img) {
  padding: 0 15px 0 3px;
}
.sbtn.imagable img {
  height: 34px;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 50%;
  filter: grayscale(1);
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  margin: 0;
  padding: 0 30px;
  border: none;
  background: var(--color-content);
  color: var(--color-invert);
  text-decoration: none;
  transition: 0.3s;
  cursor: pointer;
}
@media (hover: hover) and (pointer: fine) {
  .btn:hover {
    transform: translateY(2px);
  }
}
.btn span {
  pointer-events: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.btn span::before {
  font-family: "fa-light";
  font-size: 14px;
}
.btn.filter span::before {
  content: "\f0b0";
}
.btn.reset span::before {
  content: "\f00d";
}
.btn.apply span::before {
  content: "\f00c";
}
.btn.reload span::before {
  content: "\f01e";
}
.btn.transparent {
  border: 1px var(--color-content) solid;
  background-color: var(--color-invert);
  color: var(--color-content);
}

/* src/app/style/font.scss */
@font-face {
  font-family: "inter";
  font-weight: normal;
  font-style: normal;
  font-display: swap;
  src: url(/static/font/inter/Inter-Light.woff2);
}
@font-face {
  font-family: "inter";
  font-weight: normal;
  font-style: italic;
  font-display: swap;
  src: url(/static/font/inter/Inter-LightItalic.woff2);
}
@font-face {
  font-family: "inter";
  font-weight: bold;
  font-style: normal;
  font-display: swap;
  src: url(/static/font/inter/Inter-Bold.woff2);
}
@font-face {
  font-family: "inter";
  font-weight: bold;
  font-style: italic;
  font-display: swap;
  src: url(/static/font/inter/Inter-BoldItalic.woff2);
}
@font-face {
  font-family: "fa-solid";
  src: url(/static/font/fa/fa-solid.woff2);
  font-display: swap;
}
@font-face {
  font-family: "fa-light";
  src: url(/static/font/fa/fa-light.woff2);
  font-display: swap;
}
@font-face {
  font-family: "fa-brands";
  src: url(/static/font/fa/fa-brands.woff2);
  font-display: swap;
}

/* src/app/style/form.scss */

/* src/app/style/general.scss */
a {
  display: inline-flex;
  cursor: pointer;
  transition: 0.3s;
  -webkit-user-drag: none;
}
@media (hover: hover) and (pointer: fine) {
  a:hover {
    transform: translateY(2px);
  }
}
a.arrow {
  align-items: center;
  gap: 10px;
  color: var(--color-content);
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
}
@media (hover: hover) and (pointer: fine) {
  a.arrow.forward:hover::after {
    transform: translateX(5px);
  }
}
a.arrow.forward::after {
  display: inline-block;
  font-family: "fa-solid";
  transition: 0.3s;
  content: "\f061";
}
@media (hover: hover) and (pointer: fine) {
  a.arrow.backward:hover::before {
    transform: translateX(-5px);
  }
}
a.arrow.backward::before {
  display: inline-block;
  font-family: "fa-solid";
  transition: 0.3s;
  content: "\f060";
}
a:has(img) {
  display: block;
  overflow: hidden;
}
a:has(img) img {
  display: block;
  transition: 0.3s;
}
@media (hover: hover) and (pointer: fine) {
  a:has(img):hover {
    transform: none;
  }
  a:has(img):hover img {
    transform: scale(1.05);
  }
}
p {
  margin: 0 0 15px 0;
}
img {
  vertical-align: top;
  -webkit-user-drag: none;
}
h1 {
  padding: 0;
  text-transform: uppercase;
  font-weight: bold;
}
@media (width < 1000px) {
  h1 {
    font-size: 45px;
    line-height: 45px;
    margin: 0 0 15px 0;
  }
}
@media (width >= 1000px) {
  h1 {
    font-size: 60px;
    line-height: 60px;
    margin: 0 0 30px 0;
  }
}
@media (width < 1000px) {
  .heading {
    margin-bottom: 15px;
  }
}
@media (width >= 1000px) {
  .heading {
    margin-bottom: 30px;
  }
}
.heading h1 {
  margin: 0 0 5px 0;
}
.heading .h-param {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: bold;
  text-transform: uppercase;
}
.heading .h-param:not(:last-child) {
  margin-bottom: 5px;
}
input[type=text],
input[type=number],
input[type=email],
input[type=password] {
  height: 40px;
  padding: 0 10px;
  border: 1px var(--color-content) solid;
  background-color: var(--color-invert);
  color: var(--color-content);
  font-size: 16px;
}
::placeholder {
  color: var(--color-neutral);
}
@media (width < 1000px) {
  .content {
    padding: 15px 0 60px 0;
  }
}
@media (width >= 1000px) {
  .content {
    padding: 30px 0 120px 0;
  }
}
.textcontent {
  line-height: 150%;
}
.loading span {
  display: inline-flex;
  gap: 15px;
  align-items: center;
}
.loading span::before {
  display: inline-block;
  font-family: "fa-solid";
  content: "\f3f4";
  animation: rotation 1s linear 0s infinite, appear 1s ease 1;
}

/* src/app/style/helper.scss */

/* src/app/style/layout.scss */
html {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
html body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  overflow-anchor: none;
  overscroll-behavior: none;
  font-family:
    "inter",
    Arial,
    Helvetica,
    sans-serif;
  font-size: 16px;
}
html body * {
  box-sizing: border-box;
  outline: none;
  overflow-anchor: none;
  font-family:
    "inter",
    Arial,
    Helvetica,
    sans-serif;
}
html body #win {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  overflow-x: hidden;
  color: var(--color-content);
  background: var(--color-fbg);
}
html body #win .wrap {
  position: relative;
  background: var(--color-invert);
  opacity: 1;
  transition: opacity 0.3s;
}
html body #win .wrap.busy {
  opacity: 0.7;
}
html body #win .wrap .narrow {
  max-width: var(--width);
  margin: 0 auto;
}
@media (width < 1000px) {
  html body #win .wrap .narrow {
    padding: 0 15px;
  }
}
@media (width >= 1000px) {
  html body #win .wrap .narrow {
    padding: 0 60px;
  }
}

/* src/app/style/panel.scss */
.ovl {
  position: fixed;
  z-index: var(--z-panel);
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-ovl);
  opacity: 0;
  pointer-events: none;
  transition: 0.3s;
}
@media (width < 1000px) {
  .ovl {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    padding: 0;
  }
}
@media (width >= 1000px) {
  .ovl {
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    padding: 15px;
  }
}
.ovl .pwin {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: var(--color-invert);
  transform: translateY(100%);
  transition: 0.3s;
}
@media (width < 1000px) {
  .ovl .pwin {
    width: 100%;
    height: 100%;
    max-height: none;
    border: none;
  }
}
@media (width >= 1000px) {
  .ovl .pwin {
    width: var(--w);
    height: auto;
    max-height: 100%;
    border: 1px var(--color-content) solid;
  }
}
.ovl .pwin .p-head {
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px var(--color-content) solid;
}
@media (width < 1000px) {
  .ovl .pwin .p-head {
    padding: 0 15px;
    height: 50px;
  }
}
@media (width >= 1000px) {
  .ovl .pwin .p-head {
    padding: 0 30px;
    height: 60px;
  }
}
.ovl .pwin .p-head .p-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: bold;
  font-size: 18px;
  text-transform: uppercase;
}
.ovl .pwin .p-main {
  overflow-x: hidden;
  overflow-y: auto;
  flex-grow: 1;
}
@media (width > 1000px) {
  .ovl .pwin .p-main::-webkit-scrollbar {
    -webkit-appearance: none;
  }
  .ovl .pwin .p-main::-webkit-scrollbar:vertical {
    width: 2px;
  }
  .ovl .pwin .p-main::-webkit-scrollbar-thumb {
    background-color: var(--color-content);
  }
  .ovl .pwin .p-main::-webkit-scrollbar-track {
    background-color: transparent;
  }
}
.ovl .pwin .p-foot {
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  border-top: 1px var(--color-content) solid;
}
@media (width < 1000px) {
  .ovl .pwin .p-foot {
    padding: 0 15px;
    height: 70px;
  }
}
@media (width >= 1000px) {
  .ovl .pwin .p-foot {
    padding: 0 30px;
    height: 100px;
  }
}
.ovl.active {
  pointer-events: inherit;
  opacity: 1;
}
.ovl.active .pwin {
  transform: none;
}

/* src/app/style/var.scss */
html {
  --width: 1500px;
  --width-compact: 800px;
  --color-ovl: rgba(160,160,160,0.5);
  --color-neutral: #ccc;
  --color-alert: #c00;
}
html[data-theme=light] {
  --color-content: #000;
  --color-invert: #fff;
  --color-fbg: #000;
  --filter-vector: none;
}
html[data-theme=dark] {
  --color-content: #fff;
  --color-invert: #444;
  --color-fbg: #333;
  --filter-vector: brightness(0) invert(1);
}
html {
  --z-plinth: 10;
  --z-panel: 20;
  --z-popup: 30;
  --z-error: 90;
  --z-roof: 100;
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */