/* Exact twin of crystala #res-loading — kept outside Vite CSS minify */
#res-loading {
  --bg-dark: #1c1c1c;
  --bg-chart: #252526;
  --grid-color: #3e3e42;
  --text-primary: #303133;
  --text-secondary: #9d9d9d;
  --bull-color: #00c851;
  --bear-color: #ff4444;
  --volume-bull: #26a69a;
  --volume-bear: #ef5350;
  --border-color: #404040;
  font-size: 40px;
  font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
  color: var(--text-primary);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  height: 100vh;
  width: 100vw;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--bg-dark);
}
#res-loading .textWrapper {
  height: fit-content;
  min-width: 1em;
  width: fit-content;
  font-size: 0.5em;
  font-weight: 700;
  letter-spacing: 0.25ch;
  position: relative;
  z-index: 0;
  color: white;
}
#res-loading .textWrapper .text {
  margin: 8px 0;
  letter-spacing: 0.25ch;
}
#res-loading .invertbox {
  position: absolute;
  height: 100%;
  aspect-ratio: 1 / 1;
  left: 0;
  top: 0;
  border-radius: 20%;
  background-color: rgba(255, 255, 255, 0.1);
  backdrop-filter: invert(100%);
  -webkit-backdrop-filter: invert(100%);
  animation: move 2s ease-in-out infinite;
}
@keyframes move {
  50% {
    left: calc(100% - 2vmax);
  }
}