@import url("https://fonts.googleapis.com/css2?family=Work+Sans&wght@500&display=swap");@import url("https://fonts.googleapis.com/css2?family=Space+Mono&display=swap");@import url("https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap");@import url("https://fonts.googleapis.com/css2?family=Geist+Mono&wght@100;200;300;400;500;600;700;800;900&display=swap");.app-loading-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background-color: var(--bg-ink-400, #121317);
}
.app-loading-container .app-loading-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.app-loading-container .app-loading-content .brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 12px;
}
.app-loading-container .app-loading-content .brand .brand-logo {
  width: 40px;
  height: 40px;
}
.app-loading-container .app-loading-content .brand .brand-title {
  font-size: 20px;
  font-weight: 600;
  color: var(--bg-vanilla-100, #ffffff);
  margin: 0;
}
.app-loading-container .app-loading-content .brand-tagline {
  margin-bottom: 24px;
}
.app-loading-container .app-loading-content .brand-tagline .ant-typography {
  color: var(--bg-vanilla-400, #c0c1c3);
}
.app-loading-container .app-loading-content {
  /* HTML: <div class="loader"></div> */
}
.app-loading-container .app-loading-content .loader {
  width: 150px;
  height: 12px;
  border-radius: 2px;
  color: var(--bg-robin-500, #4e74f8);
  border: 2px solid;
  position: relative;
}
.app-loading-container .app-loading-content .loader::before {
  content: "";
  position: absolute;
  margin: 2px;
  inset: 0 100% 0 0;
  border-radius: inherit;
  background: currentColor;
  animation: l6 2s infinite;
}
@keyframes l6 {
  100% {
    inset: 0;
  }
}

.app-loading-container.lightMode {
  background-color: var(--bg-vanilla-100, #ffffff) !important;
}
.app-loading-container.lightMode .app-loading-content .brand .brand-title {
  color: var(--bg-ink-400, #121317) !important;
}
.app-loading-container.lightMode .app-loading-content .brand-tagline .ant-typography {
  color: var(--bg-ink-300, #6b7280) !important;
}
.app-loading-container.lightMode .app-loading-content .loader {
  color: var(--bg-robin-500, #4e74f8) !important;
}

.perilin-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle, #fff 10%, transparent 0);
  background-size: 12px 12px;
  opacity: 1;
  mask-image: radial-gradient(circle at 50% 0, rgba(11, 12, 14, 0.1) 0, rgba(11, 12, 14, 0) 100%);
  -webkit-mask-image: radial-gradient(circle at 50% 0, rgba(11, 12, 14, 0.1) 0, rgba(11, 12, 14, 0) 100%);
}

.app-loading-container.dark {
  background-color: var(--bg-ink-400, #121317) !important;
}
.app-loading-container.dark .app-loading-content .brand .brand-title {
  color: var(--bg-vanilla-100, #ffffff) !important;
}
.app-loading-container.dark .app-loading-content .brand-tagline .ant-typography {
  color: var(--bg-vanilla-400, #c0c1c3) !important;
}
.app-loading-container.dark .app-loading-content .loader {
  color: var(--bg-robin-500, #4e74f8) !important;
}/* Overlay stays below content */
[data-slot=dialog-overlay] {
  z-index: 50;
}

/* Dialog content always above overlay */
[data-slot=dialog-content] {
  position: fixed;
  z-index: 60;
}

.cmdk-section-heading [cmdk-group-heading] {
  text-transform: uppercase;
  color: var(--bg-slate-100);
}

/* Hide scrollbar but keep scroll */
.cmdk-list-scroll {
  scrollbar-width: none; /* Firefox */
}

.cmdk-list-scroll::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Edge */
}

.cmdk-list-scroll {
  -webkit-overflow-scrolling: touch;
}

.cmdk-input-wrapper {
  margin-left: 8px;
}

.cmdk-item-light:hover {
  cursor: pointer;
  background-color: var(--bg-vanilla-200) !important;
}

.cmdk-item-light[data-selected=true] {
  background-color: var(--bg-vanilla-300) !important;
  color: var(--bg-ink-500);
}

.cmdk-item {
  cursor: pointer;
}

[cmdk-item] svg {
  width: auto;
  height: auto;
}

.cmd-item-icon {
  margin-right: 8px;
}.shift-overlay {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  pointer-events: none;
}
.shift-overlay__panel {
  display: flex;
  gap: 20px;
  padding: 8px 12px;
  background: var(--bg-ink-500);
  color: var(--bg-vanilla-300);
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.2;
  box-shadow: 0 6px 20px var(--bg-ink-500);
  animation: shift-overlay-fade-in 120ms ease-out;
}
.shift-overlay__item {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.shift-overlay__label {
  opacity: 0.9;
}
.shift-overlay__kbd {
  font-family: monospace;
  font-size: 12px;
  padding: 2px 6px;
  display: flex;
  border-radius: 4px;
  background: var(--bg-slate-100);
}
.shift-overlay__key {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 15px;
  height: 20px;
  border-radius: 4px;
  background-color: var(--bg-slate-100);
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  color: var(--bg-vanilla-300);
  flex-shrink: 0;
}

@keyframes shift-overlay-fade-in {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}.changelog-renderer {
  position: relative;
  padding-left: 20px;
}
.changelog-renderer :is(h1, h2, h3, h4, h5, h6, p, .changelog-renderer-section-title) {
  margin-bottom: 12px;
}
.changelog-renderer-content {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.changelog-renderer-section-title {
  font-size: 14px;
  line-height: 20px;
  color: var(--text-vanilla-400, #c0c1c3);
}
.changelog-renderer .changelog-release-date {
  font-size: 14px;
  line-height: 20px;
  color: var(--text-vanilla-400, #c0c1c3);
  display: block;
  margin-bottom: 12px;
}
.changelog-renderer-list {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.changelog-renderer-line {
  position: absolute;
  left: 0;
  top: 6px;
  bottom: -30px;
  width: 1px;
  background-color: var(--bg-slate-400, #1d212d);
}
.changelog-renderer-line .inner-ball {
  position: absolute;
  left: 50%;
  width: 6px;
  height: 6px;
  border-radius: 100%;
  transform: translateX(-50%);
  background-color: var(--bg-robin-500, #7190f9);
}
.changelog-renderer ul,
.changelog-renderer ol {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-left: 30px;
  margin-bottom: 1rem;
}
.changelog-renderer ul li,
.changelog-renderer ol li {
  position: relative;
}
.changelog-renderer ul li::before,
.changelog-renderer ol li::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 10px;
  width: 20px;
  height: 2px;
  background-color: var(--bg-robin-500, #7190f9);
  transform: translate(-100%, -50%);
}
.changelog-renderer li,
.changelog-renderer p {
  font-size: 14px;
  line-height: 20px;
  color: var(--text-vanilla-400, #c0c1c3);
}
.changelog-renderer code {
  padding: 2px 4px;
  background-color: var(--bg-slate-500, #161922);
  border-radius: 6px;
  font-size: 95%;
  vertical-align: middle;
  border: 1px solid var(--bg-slate-600, #1c1f2a);
}
.changelog-renderer a {
  color: var(--text-robin-500, #7190f9);
  font-weight: 600;
  text-decoration: underline;
}
.changelog-renderer a:hover {
  text-decoration: none;
}
.changelog-renderer :is(h1, h2, h3, h4, h5, h6, .changelog-renderer-section-title) {
  font-weight: 600;
  color: var(--text-vanilla-100, #fff);
}
.changelog-renderer h1 {
  font-size: 24px;
  line-height: 32px;
}
.changelog-renderer h2, .changelog-renderer-section-title {
  font-size: 20px;
  line-height: 28px;
}
.changelog-renderer .changelog-media-image,
.changelog-renderer .changelog-media-video {
  height: auto;
  width: 100%;
  overflow: hidden;
  border-radius: 4px;
  border: 1px solid var(--bg-slate-400, #1d212d);
  margin-bottom: 28px;
}
.changelog-renderer .changelog-media-video {
  margin: 12px 0;
}

.lightMode .changelog-renderer .changelog-release-date {
  color: var(--text-ink-500);
}
.lightMode .changelog-renderer-line {
  background-color: var(--bg-vanilla-300);
}
.lightMode .changelog-renderer :is(h1, h2, h3, h4, h5, h6, p, li, .lightMode .changelog-renderer-section-title) {
  color: var(--text-ink-500);
}
.lightMode .changelog-renderer code {
  background-color: var(--bg-vanilla-300);
  border: 1px solid var(--bg-vanilla-300);
  color: var(--text-ink-500);
}.changelog-modal .ant-modal-content {
  padding: unset;
  background-color: var(--bg-ink-400, #121317);
}
.changelog-modal .ant-modal-content .ant-modal-header {
  margin-bottom: unset;
}
.changelog-modal .ant-modal-content .ant-modal-footer {
  margin-top: unset;
}
.changelog-modal-title {
  display: flex;
  align-items: center;
  gap: 8px;
  background-color: var(--bg-ink-400, #121317);
  padding: 16px;
  font-size: 14px;
  line-height: 20px;
  color: var(--text-vanilla-100, #fff);
  border-bottom: 1px solid var(--bg-slate-500, #161922);
}
.changelog-modal-footer.scroll-available .scroll-btn-container {
  display: block;
}
.changelog-modal-footer {
  position: relative;
  border: 1px solid var(--bg-slate-500, #161922);
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.changelog-modal-footer-label {
  color: var(--text-robin-400, #7190f9);
  font-size: 14px;
  line-height: 24px;
  position: relative;
  padding-left: 14px;
}
.changelog-modal-footer-label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background-color: var(--bg-robin-500, #7190f9);
}
.changelog-modal-footer-ctas {
  display: flex;
  margin-left: auto;
}
.changelog-modal-footer-ctas svg {
  font-size: 14px;
}
.changelog-modal-footer .scroll-btn-container {
  display: none;
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
}
.changelog-modal-footer .scroll-btn-container .scroll-btn {
  all: unset;
  padding: 4px 12px 4px 10px;
  background-color: var(--bg-slate-400, #1d212d);
  border-radius: 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  transition: background-color 0.1s;
}
.changelog-modal-footer .scroll-btn-container .scroll-btn:hover {
  background-color: var(--bg-slate-200, #2c3140);
}
.changelog-modal-footer .scroll-btn-container .scroll-btn:active {
  background-color: var(--bg-slate-600, #1c1f2a);
}
.changelog-modal-footer .scroll-btn-container .scroll-btn span {
  font-size: 12px;
  line-height: 18px;
  color: var(--text-vanilla-400, #c0c1c3);
}
.changelog-modal-footer .scroll-btn-container .scroll-btn svg {
  animation: pulse 1s infinite;
}
.changelog-modal-content {
  max-height: calc(100vh - 300px);
  overflow-y: auto;
  padding: 16px 16px 18px 16px;
  border: 1px solid var(--bg-slate-500, #161922);
  border-top-width: 0;
  border-bottom-width: 0;
}

@keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
.lightMode .changelog-modal .ant-modal-content {
  background-color: var(--bg-vanilla-100);
  border-color: var(--bg-vanilla-300);
}
.lightMode .changelog-modal-title {
  background: var(--bg-vanilla-100);
  color: var(--bg-ink-500);
  border-color: var(--bg-vanilla-300);
}
.lightMode .changelog-modal-content {
  border-color: var(--bg-vanilla-300);
}
.lightMode .changelog-modal-footer {
  border-color: var(--bg-vanilla-300);
}
.lightMode .changelog-modal-footer .scroll-btn-container .scroll-btn {
  background-color: var(--bg-vanilla-300);
}
.lightMode .changelog-modal-footer .scroll-btn-container .scroll-btn span {
  color: var(--text-ink-500);
}.overlay-scrollbar {
  height: 100%;
}.overlay-scroll-wrapper {
  height: 100%;
  width: 100%;
  overflow: auto;
}.nav-item {
  border-radius: 2px;
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 32px;
  margin-bottom: 4px;
  cursor: pointer;
}
.nav-item.active .nav-item-active-marker {
  background: #4e74f8;
}
.nav-item.active .nav-item-data .nav-item-label {
  color: var(--bg-vanilla-100, #fff);
}
.nav-item.disabled .nav-item-data {
  opacity: 0.5;
  cursor: not-allowed;
}
.nav-item:hover {
  cursor: pointer;
}
.nav-item:hover .nav-item-data {
  color: white;
  background: var(--bg-slate-500, #161922);
}
.nav-item.active .nav-item-data {
  color: white;
  background: var(--bg-slate-500, #161922);
}
.nav-item .nav-item-active-marker {
  margin: 4px 0;
  width: 8px;
  height: 24px;
  background: transparent;
  border-radius: 2px;
  margin-left: -5px;
}
.nav-item .nav-item-data {
  flex-grow: 1;
  max-width: calc(100% - 20px);
  display: flex;
  margin: 0px 0px 0px 6px;
  padding: 2px 8px;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  color: #c0c1c3;
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 300;
  line-height: 18px;
  background: transparent;
  transition: 0.08s all ease;
  border-radius: 3px;
}
.nav-item .nav-item-data .nav-item-icon {
  height: 16px;
}
.nav-item .nav-item-data .nav-item-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #c0c1c3;
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  letter-spacing: 0.14px;
}
.nav-item .nav-item-data .nav-item-pin-icon {
  margin-left: auto;
  cursor: pointer;
  display: none;
}
.nav-item .nav-item-data:hover .nav-item-label {
  color: var(--bg-vanilla-100, #fff);
}
.nav-item .nav-item-data:hover .nav-item-pin-icon {
  display: block;
}
.nav-item .beta-tag {
  padding-right: 0;
}

.lightMode .nav-item.active .nav-item-active-marker {
  background: #4e74f8;
}
.lightMode .nav-item.active .nav-item-data .nav-item-label {
  color: var(--bg-slate-500);
}
.lightMode .nav-item:hover {
  cursor: pointer;
}
.lightMode .nav-item:hover .nav-item-data {
  color: #121317;
  background: var(--bg-vanilla-300);
}
.lightMode .nav-item.active .nav-item-data {
  color: #121317;
  background: var(--bg-vanilla-300);
}
.lightMode .nav-item .nav-item-data {
  color: #121317;
}
.lightMode .nav-item .nav-item-data .nav-item-label {
  color: var(--bg-ink-400);
}.sidenav-container {
  width: 54px;
  height: 100%;
  position: relative;
  z-index: 1;
}
.sidenav-container.pinned {
  width: 240px;
}

.sideNav {
  flex: 0 0 54px;
  height: 100%;
  max-width: 54px;
  min-width: 54px;
  width: 54px;
  border-right: 1px solid var(--bg-slate-500, #161922);
  background: var(--bg-ink-500, #0b0c0e);
  padding-bottom: 48px;
  transition: all 0.08s ease, background 0s, border 0s;
}
.sideNav .brand-container {
  padding: 8px 15px;
  max-width: 100%;
  background: transparent;
}
.sideNav .brand-company-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  width: 100%;
  justify-content: center;
}
.sideNav .brand {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  overflow: hidden;
  gap: 32px;
  height: 32px;
  width: 100%;
}
.sideNav .brand .brand-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-shrink: 0;
  width: 20px;
  height: 16px;
  position: relative;
  cursor: pointer;
}
.sideNav .brand .brand-logo img {
  height: 16px;
  width: auto;
  display: block;
}
.sideNav .brand .brand-logo .brand-logo-name {
  font-family: "Work Sans", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  color: #fff;
}
.sideNav .brand .brand-title-section {
  display: none;
  flex-shrink: 0;
  align-items: center;
  gap: 0;
  position: relative;
}
.sideNav .brand .brand-title-section .license-type {
  display: flex;
  padding: 2px 6px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  color: var(--bg-vanilla-100);
  border-radius: 4px 0px 0px 4px;
  background: var(--bg-slate-400, #1d212d);
  text-align: center;
  font-family: Inter;
  font-size: 10px;
  font-style: normal;
  font-weight: 500;
  line-height: 14px; /* 140% */
  letter-spacing: 0.4px;
  text-transform: uppercase;
}
.sideNav .brand .brand-title-section .version-container {
  display: flex;
  align-items: center;
  padding: 2px 6px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  border-radius: 0px 4px 4px 0px;
  background: var(--bg-slate-300, #242834);
}
.sideNav .brand .brand-title-section .version {
  color: var(--bg-vanilla-400, #c0c1c3);
  text-align: center;
  font-variant-numeric: lining-nums tabular-nums slashed-zero;
  font-feature-settings: "salt" on;
  font-family: Inter;
  font-size: 10px;
  font-style: normal;
  font-weight: 500;
  line-height: 14px; /* 140% */
  letter-spacing: 0.4px;
  max-width: 60px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sideNav .brand .brand-title-section .version-clickable {
  cursor: pointer;
}
.sideNav .brand .brand-title-section .version-update-notification-dot-icon {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: var(--bg-amber-500);
  animation: ripple 1s infinite;
  margin-right: 4px;
}
.sideNav .brand .brand-title-section.version-update-notification .license-type {
  background: var(--bg-robin-500);
}
.sideNav .brand .user-history-section {
  display: none;
}
.sideNav .brand .dockBtn {
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  height: 16px;
  width: 16px;
}
.sideNav .get-started-nav-items {
  display: flex;
  margin: 4px 10px 12px 8px;
}
.sideNav .get-started-nav-items .get-started-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  gap: 8px;
  width: 100%;
  height: 32px;
  border-radius: 3px;
  border: 1px solid var(--bg-slate-400, #1d212d);
  background: var(--bg-slate-500, #161922);
  box-shadow: none !important;
  color: var(--bg-vanilla-400, #c0c1c3);
}
.sideNav .get-started-nav-items .get-started-btn svg {
  color: var(--bg-vanilla-400, #c0c1c3);
}
.sideNav .get-started-nav-items .get-started-btn .nav-item-label {
  color: var(--bg-vanilla-400, #c0c1c3);
}
.sideNav .get-started-nav-items .get-started-btn:hover:not(:disabled) {
  background: var(--bg-slate-400, #1d212d);
  border-color: var(--bg-slate-400, #1d212d);
  color: var(--bg-vanilla-100, #fff);
}
.sideNav .get-started-nav-items .get-started-btn:hover:not(:disabled) svg {
  color: var(--bg-vanilla-100, #fff);
}
.sideNav .get-started-nav-items .get-started-btn:hover:not(:disabled) .nav-item-label {
  color: var(--bg-vanilla-100, #fff);
}
.sideNav .nav-wrapper {
  height: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.sideNav .nav-wrapper .nav-item,
.sideNav .nav-wrapper .nav-dropdown-item,
.sideNav .nav-wrapper .nav-title-section,
.sideNav .nav-wrapper .nav-items-section {
  width: 100%;
}
.sideNav .nav-wrapper .nav-item {
  margin-bottom: 6px;
}
.sideNav .nav-wrapper .nav-top-section {
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
}
.sideNav .nav-wrapper .nav-top-section::-webkit-scrollbar, .sideNav .nav-wrapper .nav-top-section::-webkit-scrollbar-track, .sideNav .nav-wrapper .nav-top-section::-webkit-scrollbar-thumb {
  display: none;
}
.sideNav .nav-wrapper .nav-top-section .primary-nav-items {
  display: flex;
  flex-direction: column;
}
.sideNav .nav-wrapper .nav-top-section .primary-nav-items::-webkit-scrollbar {
  width: 0.1rem;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-title-section,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-title-section {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 16px;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-section-title {
  color: var(--bg-slate-50, #62687c);
  font-family: Inter;
  font-size: 11px;
  font-style: normal;
  font-weight: 600;
  line-height: 18px; /* 163.636% */
  letter-spacing: 0.88px;
  text-transform: uppercase;
  min-height: 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 17px;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-text,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .nav-section-title-text {
  display: none;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .nav-section-title-icon {
  display: flex;
  align-items: center;
  transition: opacity 0.08s ease, transform 0.08s ease;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .nav-section-title-icon.reorder {
  display: none;
  cursor: pointer;
  margin-left: auto;
  transition: color 0.2s;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder:hover,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .nav-section-title-icon.reorder:hover {
  color: var(--bg-vanilla-100, #fff);
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .collapse-expand-section-icon,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .collapse-expand-section-icon {
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  margin-left: auto;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-subtitle,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-section-subtitle {
  color: var(--bg-vanilla-400, #c0c1c3);
  font-family: Inter;
  font-size: 11px;
  font-style: normal;
  font-weight: 300;
  line-height: 14px; /* 150% */
  letter-spacing: 0.4px;
  padding: 6px 20px;
  opacity: 0.6;
  display: none;
  transition: all 0.08s ease, background 0s, border 0s;
  transition-delay: 0.03s;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-items-section,
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-items-section {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
  transition: all 0.08s ease;
}
.sideNav .nav-wrapper .nav-top-section .more-nav-items .nav-section-title {
  cursor: pointer;
}
.sideNav .nav-wrapper .nav-top-section .more-nav-items.collapsed .nav-items-section {
  opacity: 0;
  transform: translateY(-10px);
  transition: all 0.1s ease;
  overflow: hidden;
  height: 0;
}
.sideNav .nav-wrapper .nav-top-section .more-nav-items.expanded .nav-items-section {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.1s ease;
  overflow: hidden;
  height: auto;
}
.sideNav .nav-wrapper .nav-top-section .more-nav-items.sidebar-collapsed .nav-title-section {
  display: none;
}
.sideNav .nav-wrapper .nav-top-section .more-nav-items.sidebar-collapsed .nav-items-section {
  margin-top: 0;
  opacity: 1;
  transform: translateY(0);
  transition: all 0.08s ease;
  height: auto;
  overflow: visible;
}
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items.sidebar-collapsed .nav-items-section {
  margin-top: 0;
}
.sideNav .nav-wrapper .nav-top-section .scroll-for-more-container {
  display: none;
  position: sticky;
  width: 100%;
  bottom: 12px;
  bottom: 8px;
  margin-left: 43px;
}
.sideNav .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 8px;
  cursor: pointer;
  width: auto;
}
.sideNav .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-label {
  display: none;
}
.sideNav .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-icon {
  color: var(--bg-vanilla-400);
}
.sideNav .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-icon svg {
  animation: pulse 1s infinite;
}
.sideNav .nav-wrapper .nav-top-section .primary-nav-items,
.sideNav .nav-wrapper .nav-top-section .shortcut-nav-items,
.sideNav .nav-wrapper .nav-top-section .more-nav-items {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sideNav .nav-wrapper .nav-bottom-section {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.sideNav .nav-wrapper .nav-bottom-section .secondary-nav-items {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 8px 0;
  max-width: 100%;
  width: 54px;
  transition: all 0.08s ease, background 0s, border 0s;
  background: linear-gradient(180deg, rgba(11, 12, 14, 0) 0%, #0b0c0e 27.11%);
}
.sideNav .nav-wrapper .nav-bottom-section .secondary-nav-items::-webkit-scrollbar {
  width: 0.1rem;
}
.sideNav .nav-wrapper .nav-bottom-section .secondary-nav-items .collapse-expand-handlers {
  position: absolute;
  top: -9px;
  right: -9px;
  cursor: pointer;
  display: none;
  transition: display 0.3s;
}
.sideNav .nav-wrapper .nav-bottom-section .secondary-nav-items .collapse-expand-handlers svg {
  fill: var(--bg-vanilla-400);
  color: var(--bg-slate-300);
}
.sideNav .nav-wrapper.scroll-available .nav-bottom-section {
  border-top: 1px solid var(--bg-slate-500, #161922);
}
.sideNav .nav-wrapper-cloud {
  height: 100%;
}
.sideNav.collapsed {
  flex: 0 0 54px;
  max-width: 54px;
  min-width: 54px;
  width: 54px;
}
.sideNav.collapsed .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title {
  display: none;
}
.sideNav.collapsed .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-subtitle {
  display: none;
}
.sideNav.collapsed .nav-wrapper .nav-top-section .shortcut-nav-items .nav-items-section {
  display: flex;
  margin-top: 0;
}
.sideNav.collapsed .nav-wrapper .nav-top-section .shortcut-nav-items .nav-title-section {
  margin-top: 0;
  margin-bottom: 0;
  gap: 0;
}
.sideNav.collapsed .nav-wrapper .nav-top-section .more-nav-items .nav-section-title {
  display: none;
}
.sideNav.collapsed .nav-wrapper .nav-top-section .more-nav-items .nav-items-section {
  display: flex;
  margin-top: 0;
}
.sideNav.collapsed .nav-wrapper .nav-top-section .more-nav-items .nav-title-section {
  display: none;
}
.sideNav.collapsed .nav-wrapper .nav-bottom-section .secondary-nav-items {
  width: 54px;
}
.sideNav.collapsed .get-started-nav-items .get-started-btn {
  justify-content: center;
}
.sideNav .nav-item-label {
  display: none;
}
.sideNav .nav-item-beta,
.sideNav .nav-item-new {
  display: none;
}
.sideNav .sidenav-new-tag {
  border-radius: 12px;
  background: var(--Robin-500, #4e74f8);
  color: var(--bg-vanilla-100, #fff);
  font-variant-numeric: lining-nums tabular-nums slashed-zero;
  font-feature-settings: "case" on, "cpsp" on, "dlig" on, "salt" on;
  font-family: Inter;
  font-size: 9px;
  font-style: normal;
  font-weight: 300;
  line-height: 12px; /* 140% */
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.sideNav .sidenav-beta-tag {
  color: var(--bg-vanilla-100, #fff);
  font-variant-numeric: lining-nums tabular-nums slashed-zero;
  font-feature-settings: "case" on, "cpsp" on, "dlig" on, "salt" on;
  font-family: Inter;
  font-size: 9px;
  font-style: normal;
  font-weight: 300;
  line-height: 12px; /* 140% */
  letter-spacing: 0.3px;
  text-transform: uppercase;
  border-radius: 12px;
  background: var(--bg-slate-300);
}
.sideNav:not(.pinned) .nav-item .nav-item-data {
  justify-content: center;
}
.sideNav:not(.pinned) .shortcut-nav-items .nav-section-title,
.sideNav:not(.pinned) .more-nav-items .nav-section-title {
  padding: 0 17px;
}
.sideNav:not(.pinned) .shortcut-nav-items .nav-section-title .nav-section-title-icon,
.sideNav:not(.pinned) .more-nav-items .nav-section-title .nav-section-title-icon {
  display: none;
}
.sideNav:not(.pinned).dropdown-open .nav-item .nav-item-data {
  flex-grow: 1;
  justify-content: flex-start;
}
.sideNav:not(.pinned).dropdown-open .shortcut-nav-items .nav-section-title,
.sideNav:not(.pinned).dropdown-open .more-nav-items .nav-section-title {
  padding: 0 17px;
}
.sideNav:not(.pinned).dropdown-open .shortcut-nav-items .nav-section-title .nav-section-title-icon,
.sideNav:not(.pinned).dropdown-open .more-nav-items .nav-section-title .nav-section-title-icon {
  display: flex;
}
.sideNav:not(.pinned):hover, .sideNav.dropdown-open {
  flex: 0 0 240px;
  max-width: 240px;
  min-width: 240px;
  width: 240px;
  position: absolute;
  height: 100%;
  z-index: 10;
  background: #0b0c0e;
}
.sideNav:not(.pinned):hover .brand-container, .sideNav.dropdown-open .brand-container {
  padding: 8px 15px;
}
.sideNav:not(.pinned):hover .brand, .sideNav.dropdown-open .brand {
  justify-content: flex-start;
}
.sideNav:not(.pinned):hover .brand .brand-company-meta, .sideNav.dropdown-open .brand .brand-company-meta {
  justify-content: flex-start;
  width: 100%;
}
.sideNav:not(.pinned):hover .brand .brand-title-section, .sideNav.dropdown-open .brand .brand-title-section {
  display: flex;
  align-items: center;
}
.sideNav:not(.pinned):hover .user-history-section, .sideNav.dropdown-open .user-history-section {
  display: block;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .shortcut-nav-items, .sideNav.dropdown-open .nav-wrapper .nav-top-section .shortcut-nav-items {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-text, .sideNav.dropdown-open .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-text {
  display: block;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder, .sideNav.dropdown-open .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder {
  display: flex;
  transition: color 0.2s;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder:hover, .sideNav.dropdown-open .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder:hover {
  color: var(--bg-vanilla-100, #fff);
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-subtitle, .sideNav.dropdown-open .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-subtitle {
  display: block;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .more-nav-items, .sideNav.dropdown-open .nav-wrapper .nav-top-section .more-nav-items {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .nav-section-title-text, .sideNav.dropdown-open .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .nav-section-title-text {
  display: block;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .collapse-expand-section-icon, .sideNav.dropdown-open .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .collapse-expand-section-icon {
  display: flex;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .more-nav-items .nav-section-subtitle, .sideNav.dropdown-open .nav-wrapper .nav-top-section .more-nav-items .nav-section-subtitle {
  display: block;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .scroll-for-more-container, .sideNav.dropdown-open .nav-wrapper .nav-top-section .scroll-for-more-container {
  display: none;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more, .sideNav.dropdown-open .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 3px;
  border-radius: 20px;
  background: var(--bg-slate-400, #1d212d);
  /* Drop Shadow */
  box-shadow: 0px 103px 12px 0px rgba(0, 0, 0, 0.01), 0px 66px 18px 0px rgba(0, 0, 0, 0.01), 0px 37px 22px 0px rgba(0, 0, 0, 0.03), 0px 17px 17px 0px rgba(0, 0, 0, 0.04), 0px 4px 9px 0px rgba(0, 0, 0, 0.04);
  padding: 4px 12px 4px 10px;
  cursor: pointer;
  width: 140px;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-label, .sideNav.dropdown-open .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-label {
  color: var(--bg-vanilla-400, #c0c1c3);
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px; /* 150% */
  letter-spacing: -0.06px;
  display: block;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-icon, .sideNav.dropdown-open .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-icon {
  display: flex;
  color: var(--bg-vanilla-400);
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-icon svg, .sideNav.dropdown-open .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-icon svg {
  animation: pulse 1s infinite;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .primary-nav-items,
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .shortcut-nav-items,
.sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .more-nav-items, .sideNav.dropdown-open .nav-wrapper .nav-top-section .primary-nav-items,
.sideNav.dropdown-open .nav-wrapper .nav-top-section .shortcut-nav-items,
.sideNav.dropdown-open .nav-wrapper .nav-top-section .more-nav-items {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-bottom-section .secondary-nav-items, .sideNav.dropdown-open .nav-wrapper .nav-bottom-section .secondary-nav-items {
  width: 240px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.sideNav:not(.pinned):hover .nav-wrapper .nav-item .nav-item-data, .sideNav.dropdown-open .nav-wrapper .nav-item .nav-item-data {
  flex-grow: 1;
  justify-content: flex-start;
}
.sideNav:not(.pinned):hover .get-started-nav-items .get-started-btn, .sideNav.dropdown-open .get-started-nav-items .get-started-btn {
  justify-content: flex-start;
}
.sideNav:not(.pinned):hover .collapse-expand-handlers, .sideNav.dropdown-open .collapse-expand-handlers {
  display: block;
}
.sideNav:not(.pinned):hover .nav-item-label, .sideNav.dropdown-open .nav-item-label {
  display: block;
}
.sideNav:not(.pinned):hover .nav-item-beta,
.sideNav:not(.pinned):hover .nav-item-new, .sideNav.dropdown-open .nav-item-beta,
.sideNav.dropdown-open .nav-item-new {
  display: block;
}
.sideNav.pinned {
  flex: 0 0 240px;
  max-width: 240px;
  min-width: 240px;
  width: 240px;
  position: absolute;
  height: 100%;
  z-index: 10;
  background: #0b0c0e;
}
.sideNav.pinned .brand-container {
  padding: 8px 15px;
}
.sideNav.pinned .brand {
  justify-content: flex-start;
}
.sideNav.pinned .brand .brand-company-meta {
  justify-content: flex-start;
  width: 100%;
}
.sideNav.pinned .brand .brand-title-section {
  display: flex;
  align-items: center;
}
.sideNav.pinned .user-history-section {
  display: block;
}
.sideNav.pinned .nav-wrapper .nav-top-section .shortcut-nav-items {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}
.sideNav.pinned .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-text {
  display: block;
}
.sideNav.pinned .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder {
  display: flex;
  transition: color 0.2s;
}
.sideNav.pinned .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder:hover {
  color: var(--bg-vanilla-100, #fff);
}
.sideNav.pinned .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-subtitle {
  display: block;
}
.sideNav.pinned .nav-wrapper .nav-top-section .more-nav-items {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.sideNav.pinned .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .nav-section-title-text {
  display: block;
}
.sideNav.pinned .nav-wrapper .nav-top-section .more-nav-items .nav-section-title .collapse-expand-section-icon {
  display: flex;
}
.sideNav.pinned .nav-wrapper .nav-top-section .more-nav-items .nav-section-subtitle {
  display: block;
}
.sideNav.pinned .nav-wrapper .nav-top-section .scroll-for-more-container {
  display: none;
}
.sideNav.pinned .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 3px;
  border-radius: 20px;
  background: var(--bg-slate-400, #1d212d);
  /* Drop Shadow */
  box-shadow: 0px 103px 12px 0px rgba(0, 0, 0, 0.01), 0px 66px 18px 0px rgba(0, 0, 0, 0.01), 0px 37px 22px 0px rgba(0, 0, 0, 0.03), 0px 17px 17px 0px rgba(0, 0, 0, 0.04), 0px 4px 9px 0px rgba(0, 0, 0, 0.04);
  padding: 4px 12px 4px 10px;
  cursor: pointer;
  width: 140px;
}
.sideNav.pinned .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-label {
  display: block;
  color: var(--bg-vanilla-400, #c0c1c3);
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px; /* 150% */
  letter-spacing: -0.06px;
}
.sideNav.pinned .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-icon {
  display: flex;
  color: var(--bg-vanilla-400);
}
.sideNav.pinned .nav-wrapper .nav-top-section .scroll-for-more-container .scroll-for-more .scroll-for-more-icon svg {
  animation: pulse 1s infinite;
}
.sideNav.pinned .nav-wrapper .nav-top-section .primary-nav-items,
.sideNav.pinned .nav-wrapper .nav-top-section .shortcut-nav-items,
.sideNav.pinned .nav-wrapper .nav-top-section .more-nav-items {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.sideNav.pinned .nav-wrapper .nav-bottom-section .secondary-nav-items {
  width: 240px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.sideNav.pinned .get-started-nav-items .get-started-btn {
  justify-content: flex-start;
}
.sideNav.pinned .collapse-expand-handlers {
  display: block;
}
.sideNav.pinned .nav-item-label {
  display: block;
}
.sideNav.pinned .nav-item-beta,
.sideNav.pinned .nav-item-new {
  display: block;
}
.sideNav .nav-wrapper.scroll-available .nav-top-section .scroll-for-more-container {
  display: inline-block !important;
}

.nav-item-label-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.nav-item-label-container span {
  display: block;
  max-width: 286px;
  white-space: nowrap; /* Prevents line breaks */
  overflow: hidden; /* Hides overflowing content */
  text-overflow: ellipsis;
}

.nav-dropdown-overlay .ant-dropdown-menu {
  margin-left: 8px !important;
  padding: 0px !important;
  width: 360px !important;
  border-radius: 3px !important;
}
.nav-dropdown-overlay .ant-dropdown-menu .ant-dropdown-menu-item .ant-dropdown-menu-title-content {
  color: var(--bg-vanilla-400, #c0c1c3);
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  letter-spacing: 0.14px;
}
.nav-dropdown-overlay .ant-dropdown-menu .ant-dropdown-menu-item:hover:not(.ant-dropdown-menu-item-disabled) .ant-dropdown-menu-title-content {
  color: var(--bg-vanilla-100, #fff);
}

.settings-dropdown .user-settings-dropdown-logged-in-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.settings-dropdown .user-settings-dropdown-logged-in-section .user-settings-dropdown-label-text {
  color: var(--l3-foreground);
  font-family: Inter;
  font-size: var(--uppercase-small-500-font-size);
  font-weight: var(--uppercase-small-500-font-weight);
  font-style: normal;
  line-height: 18px;
  letter-spacing: 0.88px;
  text-transform: uppercase;
}
.settings-dropdown .user-settings-dropdown-logged-in-section .user-settings-dropdown-label-email {
  color: var(--l1-foreground);
  font-family: Inter;
  font-size: var(--font-size-xs);
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.14px;
}
.settings-dropdown .ant-dropdown-menu-item-divider {
  background-color: var(--secondary) !important;
}
.settings-dropdown .ant-dropdown-menu-item-disabled {
  opacity: 0.7;
}
.settings-dropdown .ant-dropdown-menu {
  width: 100% !important;
}

.settings-dropdown .ant-dropdown-menu-item,
.help-support-dropdown .ant-dropdown-menu-item {
  min-height: 32px;
}
.settings-dropdown .ant-dropdown-menu-item .ant-dropdown-menu-title-content,
.help-support-dropdown .ant-dropdown-menu-item .ant-dropdown-menu-title-content {
  color: var(--l1-foreground) !important;
}
.settings-dropdown .ant-dropdown-menu-item .user-settings-dropdown-logout-section,
.help-support-dropdown .ant-dropdown-menu-item .user-settings-dropdown-logout-section {
  color: var(--danger-background);
}

.secondary-nav-items .nav-item {
  position: relative;
}
.secondary-nav-items .nav-item .nav-item-active-marker {
  position: absolute;
  left: -5px;
  top: 50%;
  transform: translateY(-50%);
  margin: 0;
  width: 8px;
  height: 24px;
  z-index: 1;
}
.secondary-nav-items .nav-item-data {
  margin-left: 8px !important;
}

.reorder-shortcut-nav-items-modal {
  width: 384px !important;
}
.reorder-shortcut-nav-items-modal .ant-modal-content {
  padding: 0;
  border-radius: 4px;
  border: 1px solid var(--bg-slate-500);
  background: var(--bg-ink-400);
  box-shadow: 0px -4px 16px 2px rgba(0, 0, 0, 0.2);
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-header {
  padding: 16px;
  background: var(--bg-ink-400);
  border-bottom: 1px solid var(--bg-slate-500);
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body {
  padding: 12px 16px 0px 16px;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .ant-typography {
  color: var(--bg-vanilla-100);
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px; /* 142.857% */
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .update-name-input {
  margin-top: 8px;
  display: flex;
  gap: 8px;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
  border: 1px solid var(--bg-slate-500);
  border-radius: 4px;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container .reorder-shortcut-nav-item {
  display: flex;
  align-items: center;
  gap: 8px;
  display: flex;
  height: 32px;
  padding: 6px 8px;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid var(--bg-slate-500);
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container .reorder-shortcut-nav-item .reorder-shortcut-nav-item-grab-icon {
  display: flex;
  cursor: grab;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container .reorder-shortcut-nav-item .reorder-shortcut-nav-item-icon {
  display: flex;
  color: #c0c1c3;
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px; /* 128.571% */
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container .reorder-shortcut-nav-item .reorder-shortcut-nav-item-label {
  display: flex;
  color: #c0c1c3;
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px; /* 128.571% */
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .ant-color-picker-trigger {
  padding: 6px;
  border-radius: 2px;
  border: 1px solid var(--bg-slate-400);
  background: var(--bg-ink-300);
  width: 32px;
  height: 32px;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .ant-color-picker-trigger .ant-color-picker-color-block {
  border-radius: 50px;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .ant-color-picker-trigger .ant-color-picker-color-block .ant-color-picker-color-block-inner {
  display: flex;
  justify-content: center;
  align-items: center;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-footer {
  display: flex;
  justify-content: flex-end;
  padding: 16px 16px;
  margin: 0;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-footer > button {
  display: flex;
  align-items: center;
  border-radius: 2px;
  background: var(--Robin-500, #4e74f8) !important;
  color: var(--bg-vanilla-100) !important;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
}
.reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-footer > button.secondary-btn {
  background-color: var(--bg-slate-500, #161922) !important;
  border: 1px solid var(--bg-slate-500) !important;
  color: var(--bg-vanilla-400, #c0c1c3) !important;
  /* button/ small  */
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px; /* 200% */
}
.reorder-shortcut-nav-items-modal .title {
  color: var(--bg-vanilla-100);
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.help-support-dropdown li.ant-dropdown-menu-item-divider {
  background-color: var(--secondary) !important;
}

.lightMode .sideNav {
  background: var(--bg-vanilla-100);
  border-right: 1px solid var(--bg-vanilla-300);
}
.lightMode .sideNav .brand .brand-logo .brand-logo-name {
  color: var(--bg-ink-400);
}
.lightMode .sideNav .brand .brand-title-section .license-type {
  background: var(--bg-vanilla-300);
  color: var(--bg-ink-400);
}
.lightMode .sideNav .brand .brand-title-section .version-container {
  background: var(--bg-vanilla-300);
}
.lightMode .sideNav .brand .brand-title-section .version {
  color: var(--bg-ink-400);
}
.lightMode .sideNav .get-started-nav-items .get-started-btn {
  border: 1px solid var(--bg-vanilla-300);
  background: var(--bg-vanilla-200);
  color: var(--bg-slate-50, #62687c);
}
.lightMode .sideNav .get-started-nav-items .get-started-btn svg {
  color: var(--bg-slate-50, #62687c);
}
.lightMode .sideNav .get-started-nav-items .get-started-btn .nav-item-label {
  color: var(--bg-ink-400, #62687c);
}
.lightMode .sideNav .get-started-nav-items .get-started-btn:hover:not(:disabled) {
  background: var(--bg-vanilla-300);
  border-color: var(--bg-vanilla-300);
  color: var(--bg-slate-500, #161922);
}
.lightMode .sideNav .get-started-nav-items .get-started-btn:hover:not(:disabled) svg {
  color: var(--bg-slate-500, #161922);
}
.lightMode .sideNav .get-started-nav-items .get-started-btn:hover:not(:disabled) .nav-item-label {
  color: var(--bg-slate-500, #161922);
}
.lightMode .sideNav .brand .brand-logo .brand-logo-name {
  color: var(--bg-slate-400);
}
.lightMode .sideNav .brand-container {
  background: transparent;
}
.lightMode .sideNav .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder:hover {
  color: var(--bg-slate-400, #1d212d);
}
.lightMode .sideNav .nav-wrapper .secondary-nav-items {
  border-top: 1px solid var(--bg-vanilla-300);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 27.11%);
}
.lightMode .sideNav .nav-wrapper .secondary-nav-items .collapse-expand-handlers svg {
  color: var(--bg-slate-300);
  fill: var(--bg-vanilla-300);
}
.lightMode .sideNav.pinned .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder:hover {
  color: var(--bg-slate-400, #1d212d);
}
.lightMode .sideNav:not(.pinned):hover, .lightMode .sideNav.dropdown-open {
  background: var(--bg-vanilla-100);
}
.lightMode .sideNav:not(.pinned):hover .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder:hover, .lightMode .sideNav.dropdown-open .nav-wrapper .nav-top-section .shortcut-nav-items .nav-section-title .nav-section-title-icon.reorder:hover {
  color: var(--bg-slate-400, #1d212d);
}
.lightMode .nav-dropdown-overlay .ant-dropdown-menu .ant-dropdown-menu-item .ant-dropdown-menu-title-content {
  color: var(--bg-ink-400);
}
.lightMode .nav-dropdown-overlay .ant-dropdown-menu .ant-dropdown-menu-item:hover:not(.ant-dropdown-menu-item-disabled) .ant-dropdown-menu-title-content {
  color: var(--bg-ink-500);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content {
  border: 1px solid var(--bg-vanilla-300);
  background: var(--bg-vanilla-100);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-header {
  background: var(--bg-vanilla-100);
  border-bottom: 1px solid var(--bg-vanilla-300);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .ant-typography {
  color: var(--bg-ink-400);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container {
  border: 1px solid var(--bg-vanilla-300);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container .reorder-shortcut-nav-item {
  border-bottom: 1px solid var(--bg-vanilla-300);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container .reorder-shortcut-nav-item .reorder-shortcut-nav-item-icon {
  color: var(--bg-ink-400);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .reorder-shortcut-nav-items-container .reorder-shortcut-nav-item .reorder-shortcut-nav-item-label {
  color: var(--bg-ink-400);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-body .ant-color-picker-trigger {
  border: 1px solid var(--bg-vanilla-300);
  background: var(--bg-vanilla-100);
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-footer > button {
  background: var(--bg-robin-500) !important;
  color: var(--bg-vanilla-100) !important;
}
.lightMode .reorder-shortcut-nav-items-modal .ant-modal-content .ant-modal-footer > button.secondary-btn {
  background-color: var(--bg-vanilla-300) !important;
  border: 1px solid var(--bg-vanilla-300) !important;
  color: var(--bg-ink-400) !important;
}
.lightMode .reorder-shortcut-nav-items-modal .title {
  color: var(--bg-ink-400);
}

.version-tooltip-overlay .ant-tooltip-inner {
  background-color: var(--bg-ink-400);
  color: var(--bg-vanilla-100);
  font-size: 11px;
  border-radius: 2px;
  border: 1px solid var(--bg-slate-500);
  color: var(--bg-vanilla-100, #fff);
  font-family: Inter;
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px; /* 150% */
  letter-spacing: 0.4px;
}
.version-tooltip-overlay .version-update-notification-tooltip {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.version-tooltip-overlay .version-update-notification-tooltip .version-update-notification-tooltip-title {
  color: var(--bg-vanilla-100, #fff);
  font-family: Inter;
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px; /* 150% */
  letter-spacing: 0.4px;
}
.version-tooltip-overlay .version-update-notification-tooltip .version-update-notification-tooltip-content {
  color: var(--bg-vanilla-100, #fff);
  font-family: Inter;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px; /* 150% */
  letter-spacing: 0.4px;
}

@keyframes ripple {
  0% {
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.4);
  }
  70% {
    box-shadow: 0 0 0 6px rgba(245, 158, 11, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0);
  }
}
@keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}.header-right-section-container {
  display: flex;
  align-items: center;
  gap: 8px;
}

.share-modal-content,
.feedback-modal-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 12px;
  width: 460px;
  border-radius: 4px;
  box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(20px);
}
.share-modal-content .absolute-relative-time-toggler-container,
.feedback-modal-container .absolute-relative-time-toggler-container {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
}
.share-modal-content .absolute-relative-time-toggler-container .absolute-relative-time-toggler-label,
.feedback-modal-container .absolute-relative-time-toggler-container .absolute-relative-time-toggler-label {
  color: var(--bg-vanilla-100);
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.07px;
}
.share-modal-content .absolute-relative-time-toggler,
.feedback-modal-container .absolute-relative-time-toggler {
  display: flex;
  gap: 4px;
  align-items: center;
}
.share-modal-content .absolute-relative-time-error,
.feedback-modal-container .absolute-relative-time-error {
  font-size: 12px;
  color: var(--bg-amber-600);
}
.share-modal-content .share-link .url-share-container,
.feedback-modal-container .share-link .url-share-container {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.share-modal-content .share-link .url-share-container .url-share-container-header,
.feedback-modal-container .share-link .url-share-container .url-share-container-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.share-modal-content .share-link .url-share-container .url-share-container-header .url-share-title,
.share-modal-content .share-link .url-share-container .url-share-container-header .url-share-sub-title,
.feedback-modal-container .share-link .url-share-container .url-share-container-header .url-share-title,
.feedback-modal-container .share-link .url-share-container .url-share-container-header .url-share-sub-title {
  color: var(--bg-vanilla-100);
  font-size: 13px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.07px;
}
.share-modal-content .share-link .url-share-container .url-share-container-header .url-share-sub-title,
.feedback-modal-container .share-link .url-share-container .url-share-container-header .url-share-sub-title {
  font-size: 12px;
  color: var(--bg-vanilla-300);
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.06px;
}

.feedback-modal-container .feedback-modal-tabs {
  width: 100%;
  display: flex;
}
.feedback-modal-container .feedback-modal-tabs .ant-radio-button-wrapper {
  flex: 1;
  margin: 0px !important;
  border: 1px solid var(--bg-slate-400);
}
.feedback-modal-container .feedback-modal-tabs .ant-radio-button-wrapper:before {
  display: none;
}
.feedback-modal-container .feedback-modal-tabs .ant-radio-button-wrapper .ant-radio-button-checked {
  background-color: var(--bg-slate-400);
}
.feedback-modal-container .feedback-modal-tabs .feedback-modal-tab-label {
  display: flex;
  align-items: center;
  gap: 8px;
}
.feedback-modal-container .feedback-modal-tabs .feedback-modal-tab-label .tab-icon {
  width: 6px;
  height: 6px;
}
.feedback-modal-container .feedback-modal-tabs .feedback-modal-tab-label .feedback-tab {
  background-color: var(--bg-sakura-500);
}
.feedback-modal-container .feedback-modal-tabs .feedback-modal-tab-label .bug-tab {
  background-color: var(--bg-amber-500);
}
.feedback-modal-container .feedback-modal-tabs .feedback-modal-tab-label .feature-tab {
  background-color: var(--bg-robin-500);
}
.feedback-modal-container .feedback-modal-tabs .ant-tabs-nav-list .ant-tabs-tab {
  padding: 6px 16px;
  border-radius: 2px;
  background: var(--bg-ink-400);
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1);
  border: 1px solid var(--bg-slate-400);
  margin: 0 !important;
}
.feedback-modal-container .feedback-modal-tabs .ant-tabs-nav-list .ant-tabs-tab .ant-tabs-tab-btn {
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 166.667% */
  letter-spacing: -0.06px;
}
.feedback-modal-container .feedback-modal-tabs .ant-tabs-nav-list .ant-tabs-tab-active {
  background: var(--bg-slate-400);
  color: var(--bg-vanilla-100);
  border-bottom: none !important;
}
.feedback-modal-container .feedback-modal-tabs .ant-tabs-nav-list .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: var(--bg-vanilla-100);
}
.feedback-modal-container .feedback-modal-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.feedback-modal-container .feedback-modal-content .feedback-input {
  resize: none;
}
.feedback-modal-container .feedback-modal-content .feedback-input text-area {
  resize: none;
}
.feedback-modal-container .feedback-modal-content .feedback-content-include-console-logs {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.feedback-modal-container .feedback-modal-content-footer {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.feedback-modal-container .feedback-modal-content-footer .feedback-modal-content-footer-info-text {
  font-size: 12px;
  color: var(--bg-vanilla-400, #c0c1c3);
  text-align: center;
  /* button/ small  */
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px; /* 200% */
}
.feedback-modal-container .feedback-modal-content-footer .feedback-modal-content-footer-info-text .contact-support-link,
.feedback-modal-container .feedback-modal-content-footer .feedback-modal-content-footer-info-text .read-docs-link {
  color: var(--bg-robin-400);
  font-weight: 500;
  font-size: 12px;
}

.lightMode .share-modal-content .absolute-relative-time-toggler-container .absolute-relative-time-toggler-label,
.lightMode .feedback-modal-container .absolute-relative-time-toggler-container .absolute-relative-time-toggler-label {
  color: var(--bg-ink-400);
}
.lightMode .share-modal-content .share-link .url-share-container .url-share-container-header .url-share-title,
.lightMode .share-modal-content .share-link .url-share-container .url-share-container-header .url-share-sub-title,
.lightMode .feedback-modal-container .share-link .url-share-container .url-share-container-header .url-share-title,
.lightMode .feedback-modal-container .share-link .url-share-container .url-share-container-header .url-share-sub-title {
  color: var(--bg-ink-400);
}
.lightMode .share-modal-content .share-link .url-share-container .url-share-container-header .url-share-sub-title,
.lightMode .feedback-modal-container .share-link .url-share-container .url-share-container-header .url-share-sub-title {
  color: var(--bg-ink-300);
}
.lightMode .feedback-modal-container .feedback-modal-tabs .ant-radio-button-wrapper {
  flex: 1;
  margin: 0px !important;
  border: 1px solid var(--bg-vanilla-300);
}
.lightMode .feedback-modal-container .feedback-modal-tabs .ant-radio-button-wrapper:before {
  display: none;
}
.lightMode .feedback-modal-container .feedback-modal-tabs .ant-radio-button-wrapper .ant-radio-button-checked {
  background-color: var(--bg-vanilla-300);
}
.lightMode .feedback-modal-container .feedback-modal-content-footer .feedback-modal-content-footer-info-text {
  color: var(--bg-slate-400);
}.new-explorer-cta {
  display: flex;
  align-items: center;
  color: var(--bg-vanilla-400);
  /* Bifrost (Ancient)/Content/sm */
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.07px;
}
.new-explorer-cta .ant-btn-icon {
  margin-inline-end: 0px;
}:root {
  --border-color: var(--bg-slate-400);
}

.lightMode {
  --border-color: var(--bg-vanilla-400);
}

.timezone-picker {
  width: 532px;
  color: var(--bg-vanilla-400);
  font-family: "Inter";
}
.timezone-picker__search {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border-color);
}
.timezone-picker__input-container {
  display: flex;
  align-items: center;
  gap: 6px;
  width: -webkit-fill-available;
}
.timezone-picker__input {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  width: 100%;
  background: transparent;
  border: none;
  outline: none;
  color: var(--bg-vanilla-100);
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.07px;
  padding: 0;
}
.timezone-picker__input.ant-input:focus {
  box-shadow: none;
}
.timezone-picker__input::placeholder {
  color: var(--bg-vanilla-400);
}
.timezone-picker__esc-key {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 8px;
  color: var(--bg-vanilla-400);
  letter-spacing: -0.04px;
  border-radius: 2.286px;
  border: 1.143px solid var(--bg-ink-200);
  border-bottom-width: 2.286px;
  background: var(--bg-ink-400);
  padding: 0 1px;
}
.timezone-picker__list {
  max-height: 310px;
  overflow-y: auto;
}
.timezone-picker__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7.5px 6px 7.5px 8px;
  margin: 4px 8px;
  cursor: pointer;
  background: transparent;
  border: none;
  width: -webkit-fill-available;
  color: var(--bg-vanilla-400);
  font-family: "Inter";
}
.timezone-picker__item:hover, .timezone-picker__item.selected {
  border-radius: 2px;
  background: rgba(171, 189, 255, 0.04);
  color: var(--bg-vanilla-100);
}
.timezone-picker__item.has-divider {
  position: relative;
}
.timezone-picker__item.has-divider::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: -8px;
  right: -8px;
  border-bottom: 1px solid var(--border-color);
}
.timezone-picker__name {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.07px;
}
.timezone-picker__offset {
  color: var(--bg-vanilla-100);
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.06px;
}

.timezone-name-wrapper {
  display: flex;
  align-items: center;
  gap: 6px;
}
.timezone-name-wrapper__selected-icon {
  height: 15px;
  width: 15px;
}

.lightMode .timezone-picker__search .search-icon {
  stroke: var(--bg-ink-400);
}
.lightMode .timezone-picker__input {
  color: var(--bg-ink-100);
}
.lightMode .timezone-picker__esc-key {
  background-color: var(--bg-vanilla-100);
  border-color: var(--bg-vanilla-400);
  color: var(--bg-ink-400);
}
.lightMode .timezone-picker__item {
  color: var(--bg-ink-400);
}
.lightMode .timezone-picker__offset {
  color: var(--bg-ink-100);
}
.lightMode .timezone-name-wrapper__selected-icon .check-icon {
  stroke: var(--bg-ink-100);
}.custom-time-picker {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
}
.custom-time-picker .zoom-out-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--foreground);
  border: 1px solid var(--border);
  border-radius: 2px;
  box-shadow: none;
  padding: 10px;
  height: 33px;
}
.custom-time-picker .zoom-out-btn:hover:not(:disabled) {
  color: var(--bg-vanilla-100);
  background: var(--primary);
}
.custom-time-picker .zoom-out-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.custom-time-picker .timeSelection-input:hover {
  border-color: #1d212d !important;
}
.custom-time-picker .time-input-suffix {
  display: flex;
}

.time-options-container .time-options-item {
  margin: 2px 0;
  padding: 8px;
  border-radius: 2px;
}
.time-options-container .time-options-item.active {
  background-color: rgba(0, 0, 0, 0.2);
}
.time-options-container .time-options-item.active:hover {
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.3);
}
.time-options-container .time-options-item:hover {
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.3);
}

.time-selection-dropdown-content {
  width: 100%;
}

.timeSelection-input {
  display: flex;
  gap: 8px;
  height: 33px;
  align-items: center;
  padding: 4px 8px;
  padding-left: 0px !important;
}
.timeSelection-input input {
  width: 280px;
}
.timeSelection-input input::placeholder {
  color: white;
}
.timeSelection-input input:focus::placeholder {
  color: rgba(255, 255, 255, 0.4);
}

.valid-format-error {
  margin-top: 4px;
  color: var(--bg-cherry-400) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
}

.info-text {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  cursor: default;
  color: var(--bg-vanilla-400, #c0c1c3) !important;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.14px;
}

.info-text:hover.ant-btn-text {
  background-color: unset !important;
}

.lightMode .time-options-container .time-options-item.active {
  background-color: rgba(255, 255, 255, 0.2);
}
.lightMode .time-options-container .time-options-item.active:hover {
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.3);
}
.lightMode .time-options-container .time-options-item:hover {
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.3);
}
.lightMode .timeSelection-input {
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 4px 8px;
  padding-left: 0px !important;
}
.lightMode .timeSelection-input input::placeholder {
  color: var(---bg-ink-300);
}
.lightMode .timeSelection-input input:focus::placeholder {
  color: rgba(0, 0, 0, 0.4);
}
.lightMode .info-text {
  color: var(--bg-slate-400) !important;
}

.date-time-popover__footer {
  border-top: 1px solid var(--bg-ink-200);
  padding: 8px 14px;
}
.date-time-popover__footer .timezone-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.date-time-popover__footer .timezone-container__left {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.date-time-popover__footer .timezone-container__left .timezone__name {
  font-size: 12px;
  line-height: 16px;
  color: var(--bg-robin-400);
  font-weight: 500;
}
.date-time-popover__footer .timezone-container__left .timezone__separator {
  font-size: 12px;
  line-height: 16px;
  color: var(--bg-robin-300);
  font-weight: 500;
}
.date-time-popover__footer .timezone-container__left .timezone__offset {
  font-size: 11px;
  line-height: 14px;
  color: var(--bg-robin-400);
  font-weight: 500;
}
.date-time-popover__footer .timezone-container__right {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.date-time-popover__footer .timezone-container,
.date-time-popover__footer .timezone-container .timezone {
  font-family: Inter;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.06px;
}
.date-time-popover__footer .timezone-container {
  display: flex;
  align-items: center;
  color: var(--bg-vanilla-400);
  gap: 6px;
}
.date-time-popover__footer .timezone-container .timezone {
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 2px;
  background: rgba(171, 189, 255, 0.04);
  cursor: pointer;
  padding: 0px 4px;
  color: var(--bg-vanilla-100);
  border: none;
}

.timezone-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border-radius: 2px;
  color: var(--bg-vanilla-400);
  background-color: var(--bg-ink-200);
  font-size: 9px;
  font-weight: 400;
  line-height: 12px;
  letter-spacing: -0.045px;
  margin-right: 4px;
  width: 72px;
  cursor: pointer;
}

.time-input-prefix {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border-radius: 3px;
  width: 36px;
  font-size: 11px;
  color: var(--bg-vanilla-400);
  background-color: var(--bg-ink-200);
  cursor: pointer;
}
.time-input-prefix.is-live {
  background-color: transparent;
  color: var(--bg-forest-500);
}
.time-input-prefix .live-dot-icon {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--bg-forest-500);
  animation: ripple 1s infinite;
  margin-right: 4px;
  margin-left: 4px;
}

@keyframes ripple {
  0% {
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.4);
  }
  60% {
    box-shadow: 0 0 0 6px rgba(245, 158, 11, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0);
  }
}
.time-input-suffix-icon-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border-radius: 2px;
  background: rgba(171, 189, 255, 0.04);
  color: var(--bg-vanilla-100);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: -0.06px;
  cursor: pointer;
  height: 20px;
  width: 20px;
}
.time-input-suffix-icon-badge:hover {
  background: rgba(171, 189, 255, 0.08);
}

.lightMode .date-time-popover__footer {
  border-color: var(--bg-vanilla-400);
}
.lightMode .timezone-container {
  color: var(--bg-ink-400);
}
.lightMode .timezone-container .timezone {
  color: var(--bg-ink-100);
  background: rgba(179, 179, 179, 0.15);
}
.lightMode .timezone-container .timezone__icon {
  stroke: var(--bg-ink-100);
}
.lightMode .custom-time-picker .timeSelection-input:hover {
  border-color: var(--bg-vanilla-300) !important;
}
.lightMode .timezone-badge {
  color: var(--bg-ink-100);
  background: rgba(179, 179, 179, 0.15);
}
.lightMode .time-input-prefix {
  background-color: var(--bg-vanilla-300);
  color: var(--bg-ink-400);
}
.lightMode .time-input-suffix-icon-badge {
  color: var(--bg-ink-100);
  background: rgba(179, 179, 179, 0.15);
}
.lightMode .time-input-suffix-icon-badge:hover {
  background: rgba(179, 179, 179, 0.2);
}.auto-refresh-root .ant-popover-inner {
  min-width: 187px;
  min-height: 386px;
  border-radius: 4px;
  border: 1px solid var(--bg-slate-400);
  background: linear-gradient(139deg, rgba(18, 19, 23, 0.8) 0%, rgba(18, 19, 23, 0.9) 98.68%);
  box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(20px);
  padding: 0;
}
.auto-refresh-root .ant-popover-arrow {
  display: none;
}

.auto-refresh-menu {
  display: flex;
  flex-direction: column;
}

.auto-refresh-checkbox {
  padding: 12px 14px;
  border-bottom: 1px solid var(--bg-slate-400);
  color: #f9f9fa;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.07px;
}

.refresh-interval-text {
  padding: 12px 14px 8px 14px;
  color: #52575c;
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px; /* 163.636% */
  letter-spacing: 0.88px;
  text-transform: uppercase;
  margin-bottom: 0px !important;
}

.refresh-interval-btns {
  padding-left: 14px !important;
  color: var(--text-vanilla-400);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.07px;
  justify-content: space-between;
}

.lightMode .auto-refresh-root .ant-popover-inner {
  border: 1px solid var(--bg-vanilla-400);
  background: var(--bg-vanilla-100);
}
.lightMode .auto-refresh-checkbox {
  border-bottom: 1px solid var(--bg-vanilla-400);
  color: var(--bg-slate-400);
}
.lightMode .refresh-interval-text {
  color: var(--bg-vanilla-400);
}
.lightMode .refresh-interval-btns {
  color: var(--text-slate-400);
}.date-time-selector {
  display: flex;
  align-items: center;
}
.date-time-selector .date-time-input-element {
  display: flex;
  align-items: center;
  border-radius: 2px;
  border: 1px solid var(--bg-slate-400);
  box-shadow: none !important;
  background: var(--bg-ink-300);
  display: flex;
  min-width: 192px;
  height: 34px;
  padding: 6px 6px 6px 8px;
  flex-shrink: 0;
  text-align: start;
  margin-right: 8px;
  justify-content: space-between;
  align-items: center;
}
.date-time-selector .date-time-input-element .date-time-input-content {
  display: flex;
  align-items: center;
}
.date-time-selector .date-time-input-element .time-btn {
  margin-right: 8px;
}
.date-time-selector .date-time-input-element .down-arrow {
  margin-left: 6px;
}
.date-time-selector .refresh-text-container {
  display: none;
}
.date-time-selector .refresh-actions {
  display: flex;
  flex-direction: row;
  border-radius: 2px;
  border: 1px solid var(--bg-slate-400);
  background: var(--bg-ink-300);
  margin-left: 8px;
}
.date-time-selector .refresh-actions .refresh-btn {
  border-right: 1px solid var(--bg-slate-400);
}
.date-time-selector .refresh-actions .ant-btn {
  display: flex;
  padding: 4px 8px;
  align-items: center;
  box-shadow: none;
  border: none;
}
.date-time-selector .refresh-actions .ant-btn.active-tab {
  background-color: var(--bg-slate-400);
}
.date-time-selector .share-link-btn {
  height: 34px;
}
.date-time-selector .shareable-link-popover {
  margin-left: 8px;
}
.date-time-selector .reset-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--bg-ink-300);
  border: 1px solid var(--bg-slate-400);
  margin-right: 16px;
}

.date-time-root .ant-popover-inner,
.header-section-popover-root .ant-popover-inner {
  border-radius: 4px !important;
  border: 1px solid var(--bg-slate-400);
  box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2) !important;
  padding: 0px !important;
  border-radius: 4px;
  background: linear-gradient(139deg, rgba(18, 19, 23, 0.8) 0%, rgba(18, 19, 23, 0.9) 98.68%) !important;
  backdrop-filter: blur(20px);
}
.date-time-root .ant-popover-arrow,
.header-section-popover-root .ant-popover-arrow {
  display: none;
}

.date-time-popover {
  display: flex;
}
.date-time-popover .date-time-options {
  display: flex;
  width: 224px;
  flex-direction: column;
  border-right: 1px solid var(--bg-slate-400);
}
.date-time-popover .date-time-options .data-time-live {
  border-bottom: 1px solid var(--bg-slate-400);
  text-align: start;
  padding: 13.5px 14px;
  height: 44px;
  color: var(--bg-vanilla-400);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.14px;
  border-bottom: 1px solid var(--bg-slate-400);
}
.date-time-popover .date-time-options .active {
  background-color: rgba(171, 189, 255, 0.04) !important;
}
.date-time-popover .date-time-options .data-time-live:hover.ant-btn-text {
  background-color: rgba(171, 189, 255, 0.04) !important;
}
.date-time-popover .date-time-options .date-time-options-btn {
  text-align: start;
  padding: 8px 13px;
  height: 37px;
  color: var(--bg-vanilla-400);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.14px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  gap: 4px;
  align-items: center;
}
.date-time-popover .date-time-options .date-time-options-btn .time-value {
  font-size: 11px;
  color: var(--bg-vanilla-400);
  background-color: var(--bg-ink-200);
  padding: 4px 6px;
  border-radius: 3px;
}
.date-time-popover .date-time-options .date-time-options-btn:hover.ant-btn-text {
  background-color: rgba(171, 189, 255, 0.04) !important;
}
.date-time-popover .date-time-custom-options-container {
  display: flex;
  width: 224px;
  flex-direction: column;
  border-right: 1px solid var(--bg-slate-400);
}
.date-time-popover .date-time-custom-options-container .back-btn {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 8px;
  cursor: pointer;
}
.date-time-popover .date-time-custom-options-container .back-btn:hover {
  background-color: rgba(171, 189, 255, 0.04);
}
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to {
  display: flex;
  padding: 12px 14px;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
}
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.disabled,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.disabled {
  cursor: not-allowed;
}
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from .date-time-custom-option-from-title,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from .date-time-custom-option-to-title,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to .date-time-custom-option-from-title,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to .date-time-custom-option-to-title {
  color: var(--bg-slate-50);
  font-variant-numeric: slashed-zero;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.12px;
  text-transform: uppercase;
}
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from .date-time-custom-option-from-value,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from .date-time-custom-option-to-value,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to .date-time-custom-option-from-value,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to .date-time-custom-option-to-value {
  color: var(--bg-vanilla-400);
  font-variant-numeric: slashed-zero;
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  letter-spacing: 0.14px;
}
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active {
  background: rgba(171, 189, 255, 0.04);
}
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active .date-time-custom-option-from-title,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active .date-time-custom-option-to-title,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active .date-time-custom-option-from-title,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active .date-time-custom-option-to-title {
  color: var(--bg-vanilla-400);
}
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active .date-time-custom-option-from-value,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active .date-time-custom-option-to-value,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active .date-time-custom-option-from-value,
.date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active .date-time-custom-option-to-value {
  color: var(--bg-vanilla-100);
}
.date-time-popover .relative-date-time {
  display: flex;
  flex-direction: column;
  gap: 35px;
  padding: 13px 14px;
}
.date-time-popover .relative-date-time.date-picker {
  padding: 0px;
}
.date-time-popover .relative-date-time.relative-times {
  width: 360px;
}
.date-time-popover .relative-date-time .relative-date-time-section {
  display: flex;
  gap: 6px;
  flex-flow: wrap;
}
.date-time-popover .relative-date-time .time-selector-container {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.date-time-popover .relative-date-time .time-selector-container .input-error-message-container {
  color: var(--bg-cherry-400);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 8px;
  cursor: default;
  font-size: 12px;
  gap: 8px;
  background-color: rgba(255, 219, 218, 0.1);
  border-radius: 3px;
}
.date-time-popover .relative-date-time .time-selector-container .input-error-message-container .input-error-message-title {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.date-time-popover .relative-date-time .time-selector-container .input-error-message-container .input-error-message-description {
  font-size: 12px;
  width: 100%;
}
.date-time-popover .relative-date-time .calendar-container {
  width: 360px;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.date-time-popover .relative-date-time .calendar-container .calendar-container-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 24px;
  width: 100%;
  color: var(--bg-vanilla-400);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.14px;
  line-height: 19px;
  border-bottom: 1px solid var(--bg-slate-400);
}
.date-time-popover .relative-date-time .calendar-container .calendar-container-body {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.date-time-popover .relative-date-time .calendar-container .calendar-container-body .periscope-calendar {
  border-radius: 4px;
  border: none !important;
  background: none !important;
  padding: 0px !important;
  padding-top: 8px !important;
}
.date-time-popover .relative-date-time .calendar-container .calendar-container-body .periscope-calendar-day button:hover {
  background-color: var(--bg-robin-500) !important;
  color: var(--bg-vanilla-100) !important;
}
.date-time-popover .relative-date-time .calendar-container .calendar-container-body .calendar-actions {
  width: 100%;
  padding: 8px 16px;
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
}
.date-time-popover .relative-date-time .calendar-container .calendar-container-body .calendar-actions .apply-btn,
.date-time-popover .relative-date-time .calendar-container .calendar-container-body .calendar-actions .cancel-btn {
  width: 80px;
}
.date-time-popover .relative-date-time .recently-used-container {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.date-time-popover .relative-date-time .recently-used-container .recently-used-range {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.date-time-popover .relative-date-time .recently-used-container .recently-used-range .recently-used-range-item {
  color: var(--bg-vanilla-400);
  background-color: var(--bg-ink-200);
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.04em;
  text-align: left;
  border-radius: 2px;
  padding: 8px;
  cursor: pointer;
}
.date-time-popover .relative-date-time .recently-used-container .recently-used-range .recently-used-range-item:hover {
  background-color: var(--bg-ink-100);
  color: var(--bg-vanilla-100);
}
.date-time-popover .relative-date-time .time-heading {
  text-align: left;
  color: var(--bg-vanilla-300);
  font-size: 11px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: 0.88px;
  padding-bottom: 8px;
}
.date-time-popover .relative-date-time .time-btns {
  color: var(--bg-vanilla-400);
  background-color: #23262e;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0.04em;
  text-align: left;
  border-radius: 2px;
  padding: 4px 8px;
}

.lightMode .date-time-input-element {
  border: 1px solid var(--bg-vanilla-300);
  background: var(--bg-vanilla-100);
}
.lightMode .refresh-actions {
  border: 1px solid var(--bg-vanilla-300);
  background: var(--bg-vanilla-100);
}
.lightMode .refresh-actions .refresh-btn {
  border-right: 1px solid var(--bg-vanilla-300);
}
.lightMode .date-time-root .ant-popover-inner,
.lightMode .header-section-popover-root .ant-popover-inner {
  border: 1px solid var(--bg-vanilla-400);
  background: var(--bg-vanilla-100) !important;
}
.lightMode .date-time-popover .date-time-options {
  border-right: 1px solid var(--bg-vanilla-400);
}
.lightMode .date-time-popover .date-time-options .data-time-live {
  border-bottom: 1px solid var(--bg-vanilla-400);
  color: var(--bg-slate-400);
  border-bottom: 1px solid var(--bg-vanilla-400);
}
.lightMode .date-time-popover .date-time-options .date-time-options-btn {
  color: var(--bg-slate-400);
}
.lightMode .date-time-popover .date-time-options .date-time-options-btn .time-value {
  background-color: var(--bg-vanilla-300);
  color: var(--bg-slate-400);
}
.lightMode .date-time-popover .date-time-options .active {
  background-color: var(--bg-vanilla-300) !important;
}
.lightMode .date-time-popover .date-time-options .data-time-live:hover.ant-btn-text {
  background-color: var(--bg-vanilla-300) !important;
}
.lightMode .date-time-popover .date-time-options .date-time-options-btn:hover.ant-btn-text {
  background-color: var(--bg-vanilla-300) !important;
}
.lightMode .date-time-popover .date-time-custom-options-container {
  display: flex;
  width: 224px;
  flex-direction: column;
  border-right: 1px solid var(--bg-vanilla-400);
}
.lightMode .date-time-popover .date-time-custom-options-container .back-btn {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 8px;
  cursor: pointer;
}
.lightMode .date-time-popover .date-time-custom-options-container .back-btn:hover {
  background-color: var(--bg-vanilla-300);
}
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from .date-time-custom-option-from-title,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from .date-time-custom-option-to-title,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to .date-time-custom-option-from-title,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to .date-time-custom-option-to-title {
  color: var(--bg-slate-50);
}
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from .date-time-custom-option-from-value,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from .date-time-custom-option-to-value,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to .date-time-custom-option-from-value,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to .date-time-custom-option-to-value {
  color: var(--bg-slate-400);
}
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active {
  background: var(--bg-vanilla-300);
}
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active .date-time-custom-option-from-title,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active .date-time-custom-option-to-title,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active .date-time-custom-option-from-title,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active .date-time-custom-option-to-title {
  color: var(--bg-slate-400);
}
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active .date-time-custom-option-from-value,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-from.active .date-time-custom-option-to-value,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active .date-time-custom-option-from-value,
.lightMode .date-time-popover .date-time-custom-options-container .date-time-custom-options .date-time-custom-option-to.active .date-time-custom-option-to-value {
  color: var(--bg-slate-400);
}
.lightMode .date-time-popover .relative-date-time .time-heading {
  color: var(--bg-vanilla-400);
}
.lightMode .date-time-popover .relative-date-time .time-btns {
  background-color: var(--bg-vanilla-300);
  color: var(--bg-slate-400);
}
.lightMode .date-time-popover .relative-date-time .recently-used-container .recently-used-range .recently-used-range-item {
  color: var(--bg-slate-400);
  background-color: var(--bg-vanilla-300);
}
.lightMode .date-time-popover .relative-date-time .recently-used-container .recently-used-range .recently-used-range-item:hover {
  background-color: var(--bg-vanilla-300);
  color: var(--bg-slate-400);
}
.lightMode .reset-button {
  background: var(--bg-vanilla-100);
  border-color: var(--bg-vanilla-300);
}
.lightMode .calendar-container .periscope-calendar-day button:hover {
  background-color: var(--bg-robin-500) !important;
  color: var(--bg-ink-500) !important;
}

@media (min-width: 1400px) {
  .date-time-selector .refresh-text-container {
    display: block;
  }
}.top-nav-container {
  padding: 8px;
  border-bottom: 1px solid var(--bg-slate-500);
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 16px;
  margin-bottom: 8px;
}

.lightMode .top-nav-container {
  border-bottom: 1px solid var(--bg-vanilla-300);
}.error-boundary-fallback-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: var(--bg-vanilla-100);
}
.error-boundary-fallback-container .error-boundary-fallback-content {
  display: flex;
  flex-direction: column;
  max-width: 520px;
  gap: 8px;
}
.error-boundary-fallback-container .error-boundary-fallback-content .title,
.error-boundary-fallback-container .error-boundary-fallback-content .actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.error-boundary-fallback-container .error-boundary-fallback-content .title {
  color: var(--bg-vanilla-100);
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px; /* 128.571% */
  letter-spacing: -0.07px;
}
.error-boundary-fallback-container .error-boundary-fallback-content .description {
  color: var(--bg-vanilla-400);
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.07px;
}
.error-boundary-fallback-container .error-boundary-fallback-content .actions {
  margin-top: 16px;
}.app-banner-wrapper {
  position: relative;
  width: 100%;
}
.app-banner-wrapper .refresh-payment-status {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 4px;
}
.app-banner-wrapper .refresh-payment-status .refresh-payment-status-btn-wrapper {
  display: inline-block;
}
.app-banner-wrapper .refresh-payment-status .refresh-payment-status-btn-wrapper:hover {
  text-decoration: underline;
}

.app-layout {
  position: relative;
  height: 100%;
  width: 100%;
}
.app-layout.isWorkspaceRestricted {
  height: calc(100% - 48px);
}
.app-layout.isWorkspaceRestricted.isTrialExpired {
  height: calc(100% - 96px);
}
.app-layout.isWorkspaceRestricted.isPaymentFailed {
  height: calc(100% - 96px);
}
.app-layout.isTrialExpired {
  height: calc(100% - 48px);
}
.app-layout.isPaymentFailed {
  height: calc(100% - 48px);
}
.app-layout .app-content {
  width: calc(100% - 54px);
  z-index: 0;
  margin: 0 auto;
}
.app-layout .app-content.full-screen-content {
  width: 100% !important;
}
.app-layout .app-content .content-container {
  position: relative;
  margin: 0 1rem;
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}
.app-layout.side-nav-pinned .app-content {
  width: calc(100% - 240px);
}

.chat-support-gateway {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
}
.chat-support-gateway .chat-support-gateway-btn {
  max-width: 48px;
  width: 48px;
  max-height: 48px;
  height: 48px;
  padding: 12px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f25733;
  border: none;
}
.chat-support-gateway .chat-support-gateway-btn:hover {
  color: white !important;
  border-color: white !important;
}
.chat-support-gateway .chat-support-gateway-btn .chat-support-gateway-btn-icon {
  fill: white;
}

.add-credit-card-btn,
.cancel-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.highlight-text {
  border-radius: 2px;
  background: rgba(78, 116, 248, 0.1);
  padding-right: 4px;
  font-family: "Geist Mono";
  color: var(--bg-robin-500);
}

.add-credit-card-modal .ant-modal-footer {
  display: flex;
  justify-content: flex-end;
}
.add-credit-card-modal .cancel-btn {
  border-radius: 2px;
  border: none;
  background: var(--bg-slate-500, #161922);
  box-shadow: none;
}
.add-credit-card-modal .add-credit-card-btn {
  box-shadow: none;
}

.isDarkMode .app-layout .app-content {
  background: #0b0c0e;
}

.isLightMode .app-layout .app-content {
  background: #ffffff;
}

.trial-expiry-banner,
.slow-api-warning-banner,
.workspace-restricted-banner {
  padding: 8px;
  background-color: #f25733;
  color: white;
  text-align: center;
}

.slow-api-warning-banner {
  background-color: var(--bg-robin-500);
}
.slow-api-warning-banner .dismiss-banner {
  color: white;
  float: right;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.slow-api-warning-banner .dismiss-banner:hover {
  color: white;
}

.payment-failed-banner {
  padding: 8px;
  background-color: var(--bg-sakura-500);
  color: white;
  text-align: center;
}

.upgrade-link {
  padding: 0px;
  padding-right: 4px;
  display: inline !important;
  color: white;
  text-decoration: underline;
  text-decoration-color: white;
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}
.upgrade-link:hover {
  color: white;
  text-decoration: underline;
  text-decoration-color: white;
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}

.workspace-restricted-banner,
.trial-expiry-banner,
.payment-failed-banner {
  height: 48px;
}.key-value-label {
  display: flex;
  align-items: center;
  border: 1px solid var(--bg-slate-400);
  border-radius: 2px;
  flex-wrap: wrap;
}
.key-value-label__key, .key-value-label__value {
  padding: 1px 6px;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.005em;
}
.key-value-label__key, .key-value-label__key:hover, .key-value-label__value, .key-value-label__value:hover {
  color: var(--text-vanilla-400);
}
.key-value-label__key {
  background: var(--bg-ink-400);
  border-radius: 2px 0 0 2px;
}
.key-value-label__value {
  background: var(--bg-slate-400);
}

.lightMode .key-value-label {
  border-color: var(--bg-vanilla-400);
}
.lightMode .key-value-label__key, .lightMode .key-value-label__value {
  color: var(--text-ink-400);
}
.lightMode .key-value-label__key {
  background: var(--bg-vanilla-300);
}
.lightMode .key-value-label__value {
  background: var(--bg-vanilla-200);
}.error-content {
  display: flex;
  flex-direction: column;
}
.error-content__summary-section {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid var(--bg-slate-400);
}
.error-content__summary {
  display: flex;
  justify-content: space-between;
  padding: 16px;
}
.error-content__summary-left {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.error-content__summary-text {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.error-content__error-code {
  color: var(--bg-vanilla-100);
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px; /* 150% */
  letter-spacing: -0.08px;
}
.error-content__error-message {
  margin: 0;
  color: var(--bg-vanilla-400);
  font-size: 14px;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.07px;
}
.error-content__docs-button {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 12.5px;
  color: var(--bg-vanilla-400);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px; /* 150% */
  letter-spacing: 0.12px;
  border-radius: 2px;
  border: 1px solid var(--bg-slate-400);
  background: var(--bg-ink-300);
  box-shadow: none;
}
.error-content__message-badge {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0px 16px 16px;
}
.error-content__message-badge .key-value-label {
  width: fit-content;
  border-color: var(--bg-slate-400);
  border-radius: 20px;
  overflow: hidden;
}
.error-content__message-badge .key-value-label__key {
  padding-left: 8px;
  padding-right: 8px;
}
.error-content__message-badge .key-value-label__value {
  padding-right: 10px;
  color: var(--bg-vanilla-400);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px; /* 150% */
  letter-spacing: 0.48px;
  pointer-events: none;
}
.error-content__message-badge-label {
  display: flex;
  align-items: center;
  gap: 6px;
}
.error-content__message-badge-label-dot {
  height: 6px;
  width: 6px;
  background: var(--bg-sakura-500);
  border-radius: 50%;
}
.error-content__message-badge-label-text {
  color: var(--bg-vanilla-100);
  font-size: 10px;
  font-weight: 500;
  line-height: 18px; /* 180% */
  letter-spacing: 0.5px;
}
.error-content__message-badge-line {
  flex: 1;
  height: 8px;
  background-image: radial-gradient(circle, #444c63 1px, transparent 2px);
  background-size: 8px 11px;
  background-position: top left;
  padding: 6px;
}
.error-content__message-list-container {
  position: relative;
}
.error-content__message-list {
  margin: 0;
  padding: 0;
  list-style: none;
  max-height: 275px;
}
.error-content__message-item {
  position: relative;
  margin-bottom: 4px;
  color: var(--bg-vanilla-400);
  font-family: Geist Mono;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  color: var(--bg-vanilla-400);
  padding: 3px 12px;
  padding-left: 26px;
}
.error-content__message-item::before {
  font-family: unset;
  content: "";
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 2px;
  height: 4px;
  border-radius: 50px;
  background: var(--bg-slate-400);
}
.error-content__scroll-hint {
  position: absolute;
  bottom: 10px;
  left: 0px;
  right: 0px;
  margin: auto;
  width: fit-content;
  display: inline-flex;
  padding: 4px 12px 4px 10px;
  justify-content: center;
  align-items: center;
  gap: 3px;
  background: var(--bg-slate-200);
  border-radius: 20px;
  box-shadow: 0px 103px 12px 0px rgba(0, 0, 0, 0.01), 0px 66px 18px 0px rgba(0, 0, 0, 0.01), 0px 37px 22px 0px rgba(0, 0, 0, 0.03), 0px 17px 17px 0px rgba(0, 0, 0, 0.04), 0px 4px 9px 0px rgba(0, 0, 0, 0.04);
}
.error-content__scroll-hint-text {
  color: var(--bg-vanilla-100);
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.06px;
}

.lightMode .error-content__error-code {
  color: var(--bg-ink-100);
}
.lightMode .error-content__error-message {
  color: var(--bg-ink-400);
}
.lightMode .error-content__message-item {
  color: var(--bg-ink-400);
}
.lightMode .error-content__message-badge-label-text {
  color: var(--bg-ink-400);
}
.lightMode .error-content__message-badge .key-value-label__value {
  color: var(--bg-ink-400);
}
.lightMode .error-content__docs-button {
  background: var(--bg-vanilla-100);
  color: var(--bg-ink-100);
}.error-modal__trigger {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 4px;
  border-radius: 20px;
  background: rgba(229, 72, 77, 0.2);
  padding-left: 3px;
  padding-right: 8px;
  cursor: pointer;
}
.error-modal__trigger span {
  color: var(--bg-cherry-500);
  font-size: 10px;
  font-weight: 500;
  line-height: 20px; /* 200% */
  letter-spacing: 0.4px;
  text-transform: uppercase;
}
.error-modal__wrap {
  background: linear-gradient(180deg, rgba(11, 12, 14, 0.12) 0.07%, rgba(39, 8, 14, 0.24) 50.04%, rgba(106, 29, 44, 0.36) 75.02%, rgba(197, 57, 85, 0.48) 87.51%, rgba(242, 71, 105, 0.6) 100%);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
.error-modal__wrap .ant-modal {
  bottom: 40px;
  top: unset;
  position: absolute;
  width: 520px;
  left: 0px;
  right: 0px;
  margin: auto;
}
.error-modal__body {
  padding: 0;
  background: var(--bg-ink-400);
  overflow: hidden;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.error-modal__header {
  background: none !important;
}
.error-modal__header .ant-modal-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.error-modal__header .key-value-label {
  padding: 0;
  border: none;
  border-radius: 4px;
  overflow: hidden;
}
.error-modal__header .key-value-label__key, .error-modal__header .key-value-label__value {
  padding: 4px 8px;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0.48px;
}
.error-modal__header .key-value-label__key {
  text-transform: uppercase;
}
.error-modal__header .key-value-label__key, .error-modal__header .key-value-label__key:hover {
  color: var(--bg-vanilla-100);
}
.error-modal__header .key-value-label__value {
  color: var(--bg-vanilla-400);
  pointer-events: none;
}
.error-modal__header .close-button {
  padding: 3px 7px;
  background: var(--bg-ink-400);
  display: inline-flex;
  align-items: center;
  border-radius: 4px;
  border: 1px solid var(--bg-slate-500);
  box-shadow: none;
}
.error-modal__footer {
  margin: 0 !important;
  height: 6px;
  background: var(--bg-sakura-500);
}
.error-modal__content {
  padding: 0 !important;
  border-radius: 4px;
  overflow: hidden;
  background: none !important;
}

.lightMode .error-modal__body, .lightMode .error-modal__header .close-button {
  background: var(--bg-vanilla-100);
}
.lightMode .error-modal__header .close-button svg {
  fill: var(--bg-vanilla-100);
}




:root{--bg-robin-50:#edf1fe;--bg-robin-100:#cad5fd;--bg-robin-150:#cad5fd;--bg-robin-200:#b8c7fc;--bg-robin-300:#95acfb;--bg-robin-400:#7190f9;--bg-robin-500:#4e74f8;--bg-robin-600:#3f5ecc;--bg-robin-700:#2f48a0;--bg-robin-800:#1f3274;--bg-robin-900:#101d49;--bg-robin-950:#091233;--bg-sienna-50:#f7f2ee;--bg-sienna-100:#e6d9cd;--bg-sienna-200:#decbbc;--bg-sienna-300:#ceb29b;--bg-sienna-400:#bd9879;--bg-sienna-500:#ad7f58;--bg-sienna-600:#8a6546;--bg-sienna-700:#684c35;--bg-sienna-800:#453223;--bg-sienna-850:#34261a;--bg-sienna-900:#231912;--bg-sienna-950:#110d09;--bg-cherry-50:#fceded;--bg-cherry-100:#fadadb;--bg-cherry-200:#f7c8ca;--bg-cherry-300:#f5b6b8;--bg-cherry-400:#ea6d71;--bg-cherry-500:#e5484d;--bg-cherry-600:#b83a3e;--bg-cherry-700:#8b2c2f;--bg-cherry-800:#5e1d1f;--bg-cherry-850:#481618;--bg-cherry-900:#320f10;--bg-cherry-950:#1b0809;--bg-aqua-50:#e9f9fe;--bg-aqua-100:#c1eefd;--bg-aqua-200:#9ae4fc;--bg-aqua-300:#72d9fb;--bg-aqua-400:#4bcff9;--bg-aqua-500:#23c4f8;--bg-aqua-600:#07afe6;--bg-aqua-700:#157594;--bg-aqua-800:#0e4e63;--bg-aqua-850:#0b3b4a;--bg-aqua-900:#072732;--bg-aqua-950:#041419;--bg-sakura-50:#feedf0;--bg-sakura-100:#fbc8d2;--bg-sakura-150:#fbc8d2;--bg-sakura-200:#fab5c3;--bg-sakura-300:#f791a5;--bg-sakura-400:#f56c87;--bg-sakura-500:#f24769;--bg-sakura-600:#c53955;--bg-sakura-700:#982b41;--bg-sakura-800:#6a1d2c;--bg-sakura-850:#531622;--bg-sakura-900:#3d0f18;--bg-sakura-950:#26080e;--bg-amber-50:#fffaee;--bg-amber-100:#fff0cc;--bg-amber-150:#fff0cc;--bg-amber-200:#ffebbb;--bg-amber-300:#ffe19a;--bg-amber-400:#ffd778;--bg-amber-500:#ffcc56;--bg-amber-600:#d5aa45;--bg-amber-700:#ab8834;--bg-amber-800:#816522;--bg-amber-850:#6c5319;--bg-amber-900:#574311;--bg-amber-950:#423109;--bg-amber-1000:#2d2000;--bg-forest-50:#e9fcf4;--bg-forest-100:#d3f9e9;--bg-forest-150:#bef6de;--bg-forest-200:#a8f3d3;--bg-forest-300:#7cedbd;--bg-forest-400:#50e7a7;--bg-forest-500:#25e192;--bg-forest-600:#1eb475;--bg-forest-700:#168757;--bg-forest-800:#0f5a3a;--bg-forest-850:#0b442c;--bg-forest-900:#072d1d;--bg-forest-950:#04170f;--bg-ink-100:#2a2e37;--bg-ink-200:#23262e;--bg-ink-300:#16181d;--bg-ink-400:#121317;--bg-ink-500:#0b0c0e;--bg-vanilla-100:#fff;--bg-vanilla-200:#f5f5f5;--bg-vanilla-300:#e9e9e9;--bg-vanilla-400:#c0c1c3;--bg-slate-50:#62687c;--bg-slate-100:#3c4152;--bg-slate-200:#2c3140;--bg-slate-300:#242834;--bg-slate-400:#1d212d;--bg-slate-500:#161922;--bg-neutral-dark-50:#eceef2;--bg-neutral-dark-100:#adb4c2;--bg-neutral-dark-200:#747b8b;--bg-neutral-dark-300:#676e7d;--bg-neutral-dark-400:#5a6070;--bg-neutral-dark-500:#414755;--bg-neutral-dark-600:#343945;--bg-neutral-dark-700:#2c303a;--bg-neutral-dark-800:#23262e;--bg-neutral-dark-900:#16181d;--bg-neutral-dark-950:#121317;--bg-neutral-dark-1000:#0a0c10;--bg-neutral-light-50:#1e1f24;--bg-neutral-light-100:#62636c;--bg-neutral-light-200:#80828d;--bg-neutral-light-300:#8b8d98;--bg-neutral-light-400:#b9bbc6;--bg-neutral-light-500:#cdced7;--bg-neutral-light-600:#d8d9e0;--bg-neutral-light-700:#e0e1e6;--bg-neutral-light-800:#e7e8ec;--bg-neutral-light-900:#eff0f3;--bg-neutral-light-950:#f9f9fb;--bg-neutral-light-1000:#fcfcfd;--bg-base-black:#000;--bg-base-white:#fff;--bg-gradient-coral:linear-gradient(114deg,#ed6d68 14.99%,#fca083 77.27%);--bg-gradient-dark-shadow:linear-gradient(139deg,rgba(18,19,23,.8),rgba(18,19,23,.9) 98.68%);--bg-gradient-styx:linear-gradient(139deg,rgba(18,19,23,.8),rgba(18,19,23,.9) 98.68%);--bg-gradient-dawn:linear-gradient(99deg,#7a97fa 4.42%,#f977ff 96.6%);--bg-gradient-ocean:linear-gradient(99deg,#48f8cf 4.42%,#28cbf3 96.6%);--bg-gradient-splash:linear-gradient(99deg,#4568dc 4.42%,#324daa 96.6%);--bg-gradient-flamingo:linear-gradient(92deg,#ca9cd0 1.36%,#d38972 68.48%,#a1b1e7 98.99%);--text-robin-50:#edf1fe;--text-robin-100:#cad5fd;--text-robin-150:#cad5fd;--text-robin-200:#b8c7fc;--text-robin-300:#95acfb;--text-robin-400:#7190f9;--text-robin-500:#4e74f8;--text-robin-600:#3f5ecc;--text-robin-700:#2f48a0;--text-robin-800:#1f3274;--text-robin-900:#101d49;--text-robin-950:#091233;--text-sienna-50:#f7f2ee;--text-sienna-100:#e6d9cd;--text-sienna-200:#decbbc;--text-sienna-300:#ceb29b;--text-sienna-400:#bd9879;--text-sienna-500:#ad7f58;--text-sienna-600:#8a6546;--text-sienna-700:#684c35;--text-sienna-800:#453223;--text-sienna-850:#34261a;--text-sienna-900:#231912;--text-sienna-950:#110d09;--text-cherry-50:#fceded;--text-cherry-100:#fadadb;--text-cherry-200:#f7c8ca;--text-cherry-300:#f5b6b8;--text-cherry-400:#ea6d71;--text-cherry-500:#e5484d;--text-cherry-600:#b83a3e;--text-cherry-700:#8b2c2f;--text-cherry-800:#5e1d1f;--text-cherry-850:#481618;--text-cherry-900:#320f10;--text-cherry-950:#1b0809;--text-aqua-50:#e9f9fe;--text-aqua-100:#c1eefd;--text-aqua-200:#9ae4fc;--text-aqua-300:#72d9fb;--text-aqua-400:#4bcff9;--text-aqua-500:#23c4f8;--text-aqua-600:#07afe6;--text-aqua-700:#157594;--text-aqua-800:#0e4e63;--text-aqua-850:#0b3b4a;--text-aqua-900:#072732;--text-aqua-950:#041419;--text-sakura-50:#feedf0;--text-sakura-100:#fbc8d2;--text-sakura-150:#fbc8d2;--text-sakura-200:#fab5c3;--text-sakura-300:#f791a5;--text-sakura-400:#f56c87;--text-sakura-500:#f24769;--text-sakura-600:#c53955;--text-sakura-700:#982b41;--text-sakura-800:#6a1d2c;--text-sakura-850:#531622;--text-sakura-900:#3d0f18;--text-sakura-950:#26080e;--text-amber-50:#fffaee;--text-amber-100:#fff0cc;--text-amber-150:#fff0cc;--text-amber-200:#ffebbb;--text-amber-300:#ffe19a;--text-amber-400:#ffd778;--text-amber-500:#ffcc56;--text-amber-600:#d5aa45;--text-amber-700:#ab8834;--text-amber-800:#816522;--text-amber-850:#6c5319;--text-amber-900:#574311;--text-amber-950:#423109;--text-amber-1000:#2d2000;--text-forest-50:#e9fcf4;--text-forest-100:#d3f9e9;--text-forest-150:#bef6de;--text-forest-200:#a8f3d3;--text-forest-300:#7cedbd;--text-forest-400:#50e7a7;--text-forest-500:#25e192;--text-forest-600:#1eb475;--text-forest-700:#168757;--text-forest-800:#0f5a3a;--text-forest-850:#0b442c;--text-forest-900:#072d1d;--text-forest-950:#04170f;--text-ink-100:#2a2e37;--text-ink-200:#23262e;--text-ink-300:#16181d;--text-ink-400:#121317;--text-ink-500:#0b0c0e;--text-vanilla-100:#fff;--text-vanilla-200:#f5f5f5;--text-vanilla-300:#e9e9e9;--text-vanilla-400:#c0c1c3;--text-slate-50:#62687c;--text-slate-100:#3c4152;--text-slate-200:#2c3140;--text-slate-300:#242834;--text-slate-400:#1d212d;--text-slate-500:#161922;--text-neutral-dark-50:#eceef2;--text-neutral-dark-100:#adb4c2;--text-neutral-dark-200:#747b8b;--text-neutral-dark-300:#676e7d;--text-neutral-dark-400:#5a6070;--text-neutral-dark-500:#414755;--text-neutral-dark-600:#343945;--text-neutral-dark-700:#2c303a;--text-neutral-dark-800:#23262e;--text-neutral-dark-900:#16181d;--text-neutral-dark-950:#121317;--text-neutral-dark-1000:#0a0c10;--text-neutral-light-50:#1e1f24;--text-neutral-light-100:#62636c;--text-neutral-light-200:#80828d;--text-neutral-light-300:#8b8d98;--text-neutral-light-400:#b9bbc6;--text-neutral-light-500:#cdced7;--text-neutral-light-600:#d8d9e0;--text-neutral-light-700:#e0e1e6;--text-neutral-light-800:#e7e8ec;--text-neutral-light-900:#eff0f3;--text-neutral-light-950:#f9f9fb;--text-neutral-light-1000:#fcfcfd;--text-base-black:#000;--text-base-white:#fff;--text-gradient-coral:linear-gradient(114deg,#ed6d68 14.99%,#fca083 77.27%);--text-gradient-dark-shadow:linear-gradient(139deg,rgba(18,19,23,.8),rgba(18,19,23,.9) 98.68%);--text-gradient-styx:linear-gradient(139deg,rgba(18,19,23,.8),rgba(18,19,23,.9) 98.68%);--text-gradient-dawn:linear-gradient(99deg,#7a97fa 4.42%,#f977ff 96.6%);--text-gradient-ocean:linear-gradient(99deg,#48f8cf 4.42%,#28cbf3 96.6%);--text-gradient-splash:linear-gradient(99deg,#4568dc 4.42%,#324daa 96.6%);--text-gradient-flamingo:linear-gradient(92deg,#ca9cd0 1.36%,#d38972 68.48%,#a1b1e7 98.99%);--padding-1:0.25rem;--padding-2:0.5rem;--padding-3:0.75rem;--padding-4:1rem;--padding-5:1.25rem;--padding-6:1.5rem;--padding-7:1.75rem;--padding-8:2rem;--padding-10:2.5rem;--padding-12:3rem;--padding-16:4rem;--padding-20:5rem;--padding-24:6rem;--padding-32:8rem;--padding-40:10rem;--padding-48:12rem;--padding-56:14rem;--padding-64:16rem;--margin-1:0.25rem;--margin-2:0.5rem;--margin-3:0.75rem;--margin-4:1rem;--margin-5:1.25rem;--margin-6:1.5rem;--margin-7:1.75rem;--margin-8:2rem;--margin-10:2.5rem;--margin-12:3rem;--margin-16:4rem;--margin-20:5rem;--margin-24:6rem;--margin-32:8rem;--margin-40:10rem;--margin-48:12rem;--margin-56:14rem;--margin-64:16rem;--spacing-0:0px;--spacing-1:2px;--spacing-2:4px;--spacing-3:6px;--spacing-4:8px;--spacing-5:10px;--spacing-6:12px;--spacing-7:14px;--spacing-8:16px;--spacing-10:20px;--spacing-12:24px;--spacing-16:32px;--spacing-20:40px;--spacing-24:48px;--spacing-32:64px;--spacing-40:80px;--spacing-48:96px;--spacing-56:112px;--spacing-64:128px;--font-family-inter:Inter,sans-serif;--font-family-sf-mono:SF Mono,monospace;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--font-size-6xl:3.75rem;--font-size-7xl:4.5rem;--font-size-8xl:6rem;--font-size-9xl:8rem;--font-weight-thin:100;--font-weight-extralight:200;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--font-weight-black:900;--line-height-18:18px;--line-height-20:20px;--line-height-24:24px;--line-height-none:1;--line-height-tight:1.25;--line-height-snug:1.375;--line-height-normal:1.5;--line-height-relaxed:1.625;--line-height-loose:2;--letter-spacing-0:0px;--letter-spacing-4:4px;--letter-spacing-tighter:-0.05em;--letter-spacing-tight:-0.025em;--letter-spacing-normal:0em;--letter-spacing-wide:0.025em;--letter-spacing-wider:0.05em;--letter-spacing-widest:0.1em;--letter-spacing-0-5:-0.5px;--label-large-400-font-size:18px;--label-large-400-font-weight:400;--label-large-400-line-height:1;--label-large-400-letter-spacing:0px;--label-large-400-font-family:Inter,sans-serif;--label-large-500-font-size:18px;--label-large-500-font-weight:500;--label-large-500-line-height:1;--label-large-500-letter-spacing:0px;--label-large-500-font-family:Inter,sans-serif;--label-large-600-font-size:18px;--label-large-600-font-weight:600;--label-large-600-line-height:1;--label-large-600-letter-spacing:0px;--label-large-600-font-family:Inter,sans-serif;--label-medium-400-font-size:16px;--label-medium-400-font-weight:400;--label-medium-400-line-height:1;--label-medium-400-letter-spacing:0px;--label-medium-400-font-family:Inter,sans-serif;--label-medium-500-font-size:16px;--label-medium-500-font-weight:500;--label-medium-500-line-height:1;--label-medium-500-letter-spacing:0px;--label-medium-500-font-family:Inter,sans-serif;--label-medium-600-font-size:16px;--label-medium-600-font-weight:600;--label-medium-600-line-height:1;--label-medium-600-letter-spacing:0px;--label-medium-600-font-family:Inter,sans-serif;--label-base-400-font-size:13px;--label-base-400-font-weight:400;--label-base-400-line-height:1;--label-base-400-letter-spacing:-0.5px;--label-base-400-font-family:Inter,sans-serif;--label-base-500-font-size:13px;--label-base-500-font-weight:500;--label-base-500-line-height:1;--label-base-500-letter-spacing:-0.5px;--label-base-500-font-family:Inter,sans-serif;--label-base-600-font-size:13px;--label-base-600-font-weight:600;--label-base-600-line-height:1;--label-base-600-letter-spacing:-0.5px;--label-base-600-font-family:Inter,sans-serif;--label-small-400-font-size:11px;--label-small-400-font-weight:400;--label-small-400-line-height:1;--label-small-400-letter-spacing:0px;--label-small-400-font-family:Inter,sans-serif;--label-small-500-font-size:11px;--label-small-500-font-weight:500;--label-small-500-line-height:1;--label-small-500-letter-spacing:0px;--label-small-500-font-family:Inter,sans-serif;--label-small-600-font-size:11px;--label-small-600-font-weight:600;--label-small-600-line-height:1;--label-small-600-letter-spacing:0px;--label-small-600-font-family:Inter,sans-serif;--uppercase-base-400-font-size:13px;--uppercase-base-400-font-weight:400;--uppercase-base-400-line-height:1;--uppercase-base-400-letter-spacing:4px;--uppercase-base-400-font-family:Inter,sans-serif;--uppercase-base-500-font-size:13px;--uppercase-base-500-font-weight:500;--uppercase-base-500-line-height:1;--uppercase-base-500-letter-spacing:4px;--uppercase-base-500-font-family:Inter,sans-serif;--uppercase-base-600-font-size:13px;--uppercase-base-600-font-weight:600;--uppercase-base-600-line-height:1;--uppercase-base-600-letter-spacing:4px;--uppercase-base-600-font-family:Inter,sans-serif;--uppercase-small-400-font-size:11px;--uppercase-small-400-font-weight:400;--uppercase-small-400-line-height:1;--uppercase-small-400-letter-spacing:4px;--uppercase-small-400-font-family:Inter,sans-serif;--uppercase-small-500-font-size:11px;--uppercase-small-500-font-weight:500;--uppercase-small-500-line-height:1;--uppercase-small-500-letter-spacing:4px;--uppercase-small-500-font-family:Inter,sans-serif;--uppercase-small-600-font-size:11px;--uppercase-small-600-font-weight:600;--uppercase-small-600-line-height:1;--uppercase-small-600-letter-spacing:4px;--uppercase-small-600-font-family:Inter,sans-serif;--code-base-400-font-size:13px;--code-base-400-font-weight:400;--code-base-400-line-height:1;--code-base-400-letter-spacing:0px;--code-base-400-font-family:SF Mono,monospace;--code-base-500-font-size:13px;--code-base-500-font-weight:500;--code-base-500-line-height:1;--code-base-500-letter-spacing:0px;--code-base-500-font-family:SF Mono,monospace;--code-base-600-font-size:13px;--code-base-600-font-weight:600;--code-base-600-line-height:1;--code-base-600-letter-spacing:0px;--code-base-600-font-family:SF Mono,monospace;--code-small-400-font-size:11px;--code-small-400-font-weight:400;--code-small-400-line-height:1;--code-small-400-letter-spacing:0px;--code-small-400-font-family:SF Mono,monospace;--code-small-500-font-size:11px;--code-small-500-font-weight:500;--code-small-500-line-height:1;--code-small-500-letter-spacing:0px;--code-small-500-font-family:SF Mono,monospace;--code-small-600-font-size:11px;--code-small-600-font-weight:600;--code-small-600-line-height:1;--code-small-600-letter-spacing:0px;--code-small-600-font-family:SF Mono,monospace;--paragraph-medium-400-font-size:16px;--paragraph-medium-400-font-weight:400;--paragraph-medium-400-line-height:24px;--paragraph-medium-400-letter-spacing:0px;--paragraph-medium-400-font-family:Inter,sans-serif;--paragraph-medium-500-font-size:16px;--paragraph-medium-500-font-weight:500;--paragraph-medium-500-line-height:24px;--paragraph-medium-500-letter-spacing:0px;--paragraph-medium-500-font-family:Inter,sans-serif;--paragraph-medium-600-font-size:16px;--paragraph-medium-600-font-weight:600;--paragraph-medium-600-line-height:24px;--paragraph-medium-600-letter-spacing:0px;--paragraph-medium-600-font-family:Inter,sans-serif;--paragraph-base-400-font-size:13px;--paragraph-base-400-font-weight:400;--paragraph-base-400-line-height:20px;--paragraph-base-400-letter-spacing:-0.5px;--paragraph-base-400-font-family:Inter,sans-serif;--paragraph-base-500-font-size:13px;--paragraph-base-500-font-weight:500;--paragraph-base-500-line-height:20px;--paragraph-base-500-letter-spacing:-0.5px;--paragraph-base-500-font-family:Inter,sans-serif;--paragraph-base-600-font-size:13px;--paragraph-base-600-font-weight:600;--paragraph-base-600-line-height:20px;--paragraph-base-600-letter-spacing:-0.5px;--paragraph-base-600-font-family:Inter,sans-serif;--paragraph-small-400-font-size:11px;--paragraph-small-400-font-weight:400;--paragraph-small-400-line-height:18px;--paragraph-small-400-letter-spacing:-0.5px;--paragraph-small-400-font-family:Inter,sans-serif;--paragraph-small-500-font-size:11px;--paragraph-small-500-font-weight:500;--paragraph-small-500-line-height:18px;--paragraph-small-500-letter-spacing:-0.5px;--paragraph-small-500-font-family:Inter,sans-serif;--paragraph-small-600-font-size:11px;--paragraph-small-600-font-weight:600;--paragraph-small-600-line-height:18px;--paragraph-small-600-letter-spacing:-0.5px;--paragraph-small-600-font-family:Inter,sans-serif}
/*! 
 * OverlayScrollbars
 * Version: 2.9.2
 * 
 * Copyright (c) Rene Haas | KingSora.
 * https://github.com/KingSora
 * 
 * Released under the MIT license.
 */
.os-size-observer,
.os-size-observer-listener {
  scroll-behavior: auto !important;
  direction: inherit;
  pointer-events: none;
  overflow: hidden;
  visibility: hidden;
  box-sizing: border-box;
}
.os-size-observer,
.os-size-observer-listener,
.os-size-observer-listener-item,
.os-size-observer-listener-item-final {
  writing-mode: horizontal-tb;
  position: absolute;
  left: 0;
  top: 0;
}
.os-size-observer {
  z-index: -1;
  contain: strict;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  padding: inherit;
  border: inherit;
  box-sizing: inherit;
  margin: -133px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform: scale(0.1);
}
.os-size-observer::before {
  content: "";
  flex: none;
  box-sizing: inherit;
  padding: 10px;
  width: 10px;
  height: 10px;
}
.os-size-observer-appear {
  animation: os-size-observer-appear-animation 1ms forwards;
}
.os-size-observer-listener {
  box-sizing: border-box;
  position: relative;
  flex: auto;
  padding: inherit;
  border: inherit;
  margin: -133px;
  transform: scale(calc(1 / 0.1));
}
.os-size-observer-listener.ltr {
  margin-right: -266px;
  margin-left: 0;
}
.os-size-observer-listener.rtl {
  margin-left: -266px;
  margin-right: 0;
}
.os-size-observer-listener:empty::before {
  content: "";
  width: 100%;
  height: 100%;
}
.os-size-observer-listener:empty::before, .os-size-observer-listener > .os-size-observer-listener-item {
  display: block;
  position: relative;
  padding: inherit;
  border: inherit;
  box-sizing: content-box;
  flex: auto;
}
.os-size-observer-listener-scroll {
  box-sizing: border-box;
  display: flex;
}
.os-size-observer-listener-item {
  right: 0;
  bottom: 0;
  overflow: hidden;
  direction: ltr;
  flex: none;
}
.os-size-observer-listener-item-final {
  transition: none;
}
@keyframes os-size-observer-appear-animation {
  from {
    cursor: auto;
  }
  to {
    cursor: none;
  }
}
.os-trinsic-observer {
  flex: none;
  box-sizing: border-box;
  position: relative;
  max-width: 0px;
  max-height: 1px;
  padding: 0;
  margin: 0;
  border: none;
  overflow: hidden;
  z-index: -1;
  height: 0;
  top: calc(100% + 1px);
  contain: strict;
}
.os-trinsic-observer:not(:empty) {
  height: calc(100% + 1px);
  top: -1px;
}
.os-trinsic-observer:not(:empty) > .os-size-observer {
  width: 1000%;
  height: 1000%;
  min-height: 1px;
  min-width: 1px;
}
/**
 * hide native scrollbars
 * changes to this styles need to be reflected in the environment styles to correctly detect scrollbar hiding
 */
[data-overlayscrollbars-initialize],
[data-overlayscrollbars-viewport~=scrollbarHidden] {
  scrollbar-width: none !important;
}
[data-overlayscrollbars-initialize]::-webkit-scrollbar,
[data-overlayscrollbars-initialize]::-webkit-scrollbar-corner,
[data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar,
[data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar-corner {
  -webkit-appearance: none !important;
          appearance: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
/**
 * elements wont suddenly clip after initialization is done
 */
[data-overlayscrollbars-initialize]:not([data-overlayscrollbars]):not(html):not(body) {
  overflow: auto;
}
/**
 * applied to body 
 */
html[data-overlayscrollbars-body] {
  overflow: hidden;
}
html[data-overlayscrollbars-body],
html[data-overlayscrollbars-body] > body {
  width: 100%;
  height: 100%;
  margin: 0;
}
html[data-overlayscrollbars-body] > body {
  overflow: visible;
  margin: 0;
}
/**
 * structure setup 
 */
[data-overlayscrollbars] {
  position: relative;
}
[data-overlayscrollbars~=host],
[data-overlayscrollbars-padding] {
  display: flex;
  align-items: stretch !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  scroll-behavior: auto !important;
}
[data-overlayscrollbars-padding],
[data-overlayscrollbars-viewport]:not([data-overlayscrollbars]) {
  box-sizing: inherit;
  position: relative;
  flex: auto !important;
  height: auto;
  width: 100%;
  min-width: 0;
  padding: 0;
  margin: 0;
  border: none;
  z-index: 0;
}
[data-overlayscrollbars-viewport]:not([data-overlayscrollbars]) {
  --os-vaw: 0;
  --os-vah: 0;
  outline: none;
}
[data-overlayscrollbars-viewport]:not([data-overlayscrollbars]):focus {
  outline: none;
}
[data-overlayscrollbars-viewport][data-overlayscrollbars-viewport~=arrange]::before {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: -1;
  min-width: 1px;
  min-height: 1px;
  width: var(--os-vaw);
  height: var(--os-vah);
}
[data-overlayscrollbars],
[data-overlayscrollbars-padding],
[data-overlayscrollbars-viewport] {
  overflow: hidden !important;
}
[data-overlayscrollbars~=noClipping],
[data-overlayscrollbars-padding~=noClipping] {
  overflow: visible !important;
}
[data-overlayscrollbars-viewport~=measuring] {
  overflow: hidden !important;
  scroll-behavior: auto !important;
  scroll-snap-type: none !important;
}
[data-overlayscrollbars-viewport~=overflowXVisible]:not([data-overlayscrollbars-viewport~=measuring]) {
  overflow-x: visible !important;
}
[data-overlayscrollbars-viewport~=overflowXHidden] {
  overflow-x: hidden !important;
}
[data-overlayscrollbars-viewport~=overflowXScroll] {
  overflow-x: scroll !important;
}
[data-overlayscrollbars-viewport~=overflowYVisible]:not([data-overlayscrollbars-viewport~=measuring]) {
  overflow-y: visible !important;
}
[data-overlayscrollbars-viewport~=overflowYHidden] {
  overflow-y: hidden !important;
}
[data-overlayscrollbars-viewport~=overflowYScroll] {
  overflow-y: scroll !important;
}
[data-overlayscrollbars-viewport~=noContent]:not(#osFakeId) {
  font-size: 0 !important;
  line-height: 0 !important;
}
[data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::before,
[data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::after,
[data-overlayscrollbars-viewport~=noContent]:not(#osFakeId) > * {
  display: none !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border-width: 0 !important;
}
[data-overlayscrollbars-viewport~=scrolling] {
  scroll-behavior: auto !important;
  scroll-snap-type: none !important;
}
[data-overlayscrollbars-content] {
  box-sizing: inherit;
}
/**
 * Display contents to bridge any flickering during deferred initialization.
 */
[data-overlayscrollbars-contents]:not(#osFakeId):not([data-overlayscrollbars-padding]):not([data-overlayscrollbars-viewport]):not([data-overlayscrollbars-content]) {
  display: contents;
}
/**
 * optional & experimental grid mode
 */
[data-overlayscrollbars-grid],
[data-overlayscrollbars-grid] [data-overlayscrollbars-padding] {
  display: grid;
  grid-template: 1fr/1fr;
}
[data-overlayscrollbars-grid] > [data-overlayscrollbars-padding],
[data-overlayscrollbars-grid] > [data-overlayscrollbars-viewport],
[data-overlayscrollbars-grid] > [data-overlayscrollbars-padding] > [data-overlayscrollbars-viewport] {
  height: auto !important;
  width: auto !important;
}
@property --os-scroll-percent {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
@property --os-viewport-percent {
  syntax: "<number>";
  inherits: true;
  initial-value: 0;
}
.os-scrollbar {
  --os-viewport-percent: 0;
  --os-scroll-percent: 0;
  --os-scroll-direction: 0;
  --os-scroll-percent-directional: calc(
    var(--os-scroll-percent) - (var(--os-scroll-percent) + (1 - var(--os-scroll-percent)) * -1) *
      var(--os-scroll-direction)
  );
}
.os-scrollbar {
  contain: size layout;
  contain: size layout style;
  transition: opacity 0.15s, visibility 0.15s, top 0.15s, right 0.15s, bottom 0.15s, left 0.15s;
  pointer-events: none;
  position: absolute;
  opacity: 0;
  visibility: hidden;
}
body > .os-scrollbar {
  position: fixed;
  z-index: 99999;
}
.os-scrollbar-transitionless {
  transition: none !important;
}
.os-scrollbar-track {
  position: relative;
  padding: 0 !important;
  border: none !important;
}
.os-scrollbar-handle {
  position: absolute;
}
.os-scrollbar-track,
.os-scrollbar-handle {
  pointer-events: none;
  width: 100%;
  height: 100%;
}
.os-scrollbar.os-scrollbar-track-interactive .os-scrollbar-track,
.os-scrollbar.os-scrollbar-handle-interactive .os-scrollbar-handle {
  pointer-events: auto;
  touch-action: none;
}
.os-scrollbar-horizontal {
  bottom: 0;
  left: 0;
}
.os-scrollbar-vertical {
  top: 0;
  right: 0;
}
.os-scrollbar-rtl.os-scrollbar-horizontal {
  right: 0;
}
.os-scrollbar-rtl.os-scrollbar-vertical {
  right: auto;
  left: 0;
}
.os-scrollbar-visible {
  opacity: 1;
  visibility: visible;
}
.os-scrollbar-auto-hide.os-scrollbar-auto-hide-hidden {
  opacity: 0;
  visibility: hidden;
}
.os-scrollbar-interaction.os-scrollbar-visible {
  opacity: 1;
  visibility: visible;
}
.os-scrollbar-unusable,
.os-scrollbar-unusable *,
.os-scrollbar-wheel,
.os-scrollbar-wheel * {
  pointer-events: none !important;
}
.os-scrollbar-unusable .os-scrollbar-handle {
  opacity: 0 !important;
  transition: none !important;
}
.os-scrollbar-horizontal .os-scrollbar-handle {
  bottom: 0;
  left: calc(var(--os-scroll-percent-directional) * 100%);
  transform: translateX(calc(var(--os-scroll-percent-directional) * -100%));
  width: calc(var(--os-viewport-percent) * 100%);
}
.os-scrollbar-vertical .os-scrollbar-handle {
  right: 0;
  top: calc(var(--os-scroll-percent-directional) * 100%);
  transform: translateY(calc(var(--os-scroll-percent-directional) * -100%));
  height: calc(var(--os-viewport-percent) * 100%);
}
@supports (container-type: size) {
  .os-scrollbar-track {
    container-type: size;
  }
  .os-scrollbar-horizontal .os-scrollbar-handle {
    left: auto;
    transform: translateX(calc(var(--os-scroll-percent-directional) * 100cqw + var(--os-scroll-percent-directional) * -100%));
  }
  .os-scrollbar-vertical .os-scrollbar-handle {
    top: auto;
    transform: translateY(calc(var(--os-scroll-percent-directional) * 100cqh + var(--os-scroll-percent-directional) * -100%));
  }
  .os-scrollbar-rtl.os-scrollbar-horizontal .os-scrollbar-handle {
    right: auto;
    left: 0;
  }
}
.os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle {
  right: auto;
  left: 0;
}
.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless,
.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless.os-scrollbar-rtl {
  left: 0;
  right: 0;
}
.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless,
.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless.os-scrollbar-rtl {
  top: 0;
  bottom: 0;
}
@media print {
  .os-scrollbar {
    display: none;
  }
}
.os-scrollbar {
  --os-size: 0;
  --os-padding-perpendicular: 0;
  --os-padding-axis: 0;
  --os-track-border-radius: 0;
  --os-track-bg: none;
  --os-track-bg-hover: none;
  --os-track-bg-active: none;
  --os-track-border: none;
  --os-track-border-hover: none;
  --os-track-border-active: none;
  --os-handle-border-radius: 0;
  --os-handle-bg: none;
  --os-handle-bg-hover: none;
  --os-handle-bg-active: none;
  --os-handle-border: none;
  --os-handle-border-hover: none;
  --os-handle-border-active: none;
  --os-handle-min-size: 33px;
  --os-handle-max-size: none;
  --os-handle-perpendicular-size: 100%;
  --os-handle-perpendicular-size-hover: 100%;
  --os-handle-perpendicular-size-active: 100%;
  --os-handle-interactive-area-offset: 0;
}
.os-scrollbar-track {
  border: var(--os-track-border);
  border-radius: var(--os-track-border-radius);
  background: var(--os-track-bg);
  transition: opacity 0.15s, background-color 0.15s, border-color 0.15s;
}
.os-scrollbar-track:hover {
  border: var(--os-track-border-hover);
  background: var(--os-track-bg-hover);
}
.os-scrollbar-track:active {
  border: var(--os-track-border-active);
  background: var(--os-track-bg-active);
}
.os-scrollbar-handle {
  border: var(--os-handle-border);
  border-radius: var(--os-handle-border-radius);
  background: var(--os-handle-bg);
}
.os-scrollbar-handle:hover {
  border: var(--os-handle-border-hover);
  background: var(--os-handle-bg-hover);
}
.os-scrollbar-handle:active {
  border: var(--os-handle-border-active);
  background: var(--os-handle-bg-active);
}
.os-scrollbar-track:before,
.os-scrollbar-handle:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: block;
}
.os-scrollbar-horizontal {
  padding: var(--os-padding-perpendicular) var(--os-padding-axis);
  right: var(--os-size);
  height: var(--os-size);
}
.os-scrollbar-horizontal.os-scrollbar-rtl {
  left: var(--os-size);
  right: 0;
}
.os-scrollbar-horizontal .os-scrollbar-track:before {
  top: calc(var(--os-padding-perpendicular) * -1);
  bottom: calc(var(--os-padding-perpendicular) * -1);
}
.os-scrollbar-horizontal .os-scrollbar-handle {
  min-width: var(--os-handle-min-size);
  max-width: var(--os-handle-max-size);
  height: var(--os-handle-perpendicular-size);
  transition: opacity 0.15s, background-color 0.15s, border-color 0.15s, height 0.15s;
}
.os-scrollbar-horizontal .os-scrollbar-handle:before {
  top: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
  bottom: calc(var(--os-padding-perpendicular) * -1);
}
.os-scrollbar-horizontal:hover .os-scrollbar-handle {
  height: var(--os-handle-perpendicular-size-hover);
}
.os-scrollbar-horizontal:active .os-scrollbar-handle {
  height: var(--os-handle-perpendicular-size-active);
}
.os-scrollbar-vertical {
  padding: var(--os-padding-axis) var(--os-padding-perpendicular);
  bottom: var(--os-size);
  width: var(--os-size);
}
.os-scrollbar-vertical .os-scrollbar-track:before {
  left: calc(var(--os-padding-perpendicular) * -1);
  right: calc(var(--os-padding-perpendicular) * -1);
}
.os-scrollbar-vertical .os-scrollbar-handle {
  min-height: var(--os-handle-min-size);
  max-height: var(--os-handle-max-size);
  width: var(--os-handle-perpendicular-size);
  transition: opacity 0.15s, background-color 0.15s, border-color 0.15s, width 0.15s;
}
.os-scrollbar-vertical .os-scrollbar-handle:before {
  left: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
  right: calc(var(--os-padding-perpendicular) * -1);
}
.os-scrollbar-vertical.os-scrollbar-rtl .os-scrollbar-handle:before {
  right: calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);
  left: calc(var(--os-padding-perpendicular) * -1);
}
.os-scrollbar-vertical:hover .os-scrollbar-handle {
  width: var(--os-handle-perpendicular-size-hover);
}
.os-scrollbar-vertical:active .os-scrollbar-handle {
  width: var(--os-handle-perpendicular-size-active);
}
/* NONE THEME: */
[data-overlayscrollbars-viewport~=measuring] > .os-scrollbar,
.os-theme-none.os-scrollbar {
  display: none !important;
}
/* DARK & LIGHT THEME: */
.os-theme-dark,
.os-theme-light {
  box-sizing: border-box;
  --os-size: 10px;
  --os-padding-perpendicular: 2px;
  --os-padding-axis: 2px;
  --os-track-border-radius: 10px;
  --os-handle-interactive-area-offset: 4px;
  --os-handle-border-radius: 10px;
}
.os-theme-dark {
  --os-handle-bg: rgba(0, 0, 0, 0.44);
  --os-handle-bg-hover: rgba(0, 0, 0, 0.55);
  --os-handle-bg-active: rgba(0, 0, 0, 0.66);
}
.os-theme-light {
  --os-handle-bg: rgba(255, 255, 255, 0.44);
  --os-handle-bg-hover: rgba(255, 255, 255, 0.55);
  --os-handle-bg-active: rgba(255, 255, 255, 0.66);
}
[data-theme=default]{color-scheme:light;--background:var(--bg-vanilla-200);--foreground:var(--text-ink-400);--card:var(--bg-vanilla-100);--card-foreground:var(--text-ink-400);--popover:var(--bg-vanilla-100);--popover-foreground:var(--text-ink-400);--primary:var(--bg-robin-500);--secondary:var(--bg-vanilla-300);--muted:var(--bg-vanilla-300);--muted-foreground:var(--text-slate-50);--accent:var(--bg-aqua-100);--accent-foreground:var(--text-slate-400);--destructive:var(--bg-cherry-500);--destructive-foreground:var(--text-vanilla-100);--border:var(--bg-vanilla-400);--input:var(--bg-vanilla-400);--ring:var(--bg-robin-500);--radius:0.25rem;--chart-1:var(--bg-robin-500);--chart-2:var(--bg-robin-600);--chart-3:var(--bg-slate-300);--chart-4:var(--bg-slate-400);--chart-5:var(--bg-slate-500);--sidebar:var(--bg-vanilla-300);--sidebar-foreground:var(--text-ink-400);--sidebar-primary:var(--bg-robin-500);--sidebar-primary-foreground:var(--text-vanilla-100);--sidebar-accent:var(--bg-aqua-100);--sidebar-accent-foreground:var(--text-slate-400);--sidebar-border:var(--bg-slate-400);--sidebar-ring:var(--bg-robin-500);--font-sans:"Inter";--font-serif:"Open Sans";--font-mono:"Geist Mono";--base-white:var(--text-base-white);--base-black:var(--text-base-black);--l1-background:var(--bg-neutral-light-1000);--l2-background:var(--bg-neutral-light-950);--l3-background:var(--bg-neutral-light-800);--l1-background-hover:var(--bg-neutral-light-900);--l2-background-hover:var(--bg-neutral-light-700);--l3-background-hover:var(--bg-neutral-light-700);--l1-foreground:var(--text-neutral-light-50);--l1-foreground-hover:var(--text-base-black);--l2-foreground:var(--text-neutral-light-100);--l2-foreground-hover:var(--text-neutral-light-50);--l3-foreground:var(--text-neutral-light-200);--l3-foreground-hover:var(--text-neutral-light-300);--l1-border:var(--bg-neutral-light-900);--l2-border:var(--bg-neutral-light-800);--l3-border:var(--bg-neutral-light-700);--primary-background:var(--bg-robin-500);--primary-background-hover:var(--bg-robin-400);--primary-foreground:var(--text-neutral-light-1000);--primary-foreground-hover:var(--text-base-white);--secondary-background:var(--bg-neutral-light-950);--secondary-background-hover:var(--bg-neutral-light-700);--secondary-foreground:var(--text-neutral-light-100);--secondary-foreground-hover:var(--text-neutral-light-50);--secondary-border:var(--bg-neutral-light-800);--success-background:var(--bg-forest-600);--success-background-hover:var(--bg-forest-400);--success-foreground:var(--text-neutral-light-50);--success-foreground-hover:var(--text-base-black);--warning-background:var(--bg-amber-600);--warning-background-hover:var(--bg-amber-400);--warning-foreground:var(--text-neutral-light-50);--warning-foreground-hover:var(--text-base-black);--danger-background:var(--bg-cherry-500);--danger-background-hover:var(--bg-cherry-400);--danger-foreground:var(--text-neutral-light-1000);--danger-foreground-hover:var(--text-base-white);--l1-background-transparent:color-mix(in srgb,var(--bg-neutral-light-1000),transparent 100%);--l1-background-60:color-mix(in srgb,var(--bg-neutral-light-1000),transparent 40%);--l2-background-transparent:color-mix(in srgb,var(--bg-neutral-light-950),transparent 100%);--l2-background-60:color-mix(in srgb,var(--bg-neutral-light-950),transparent 40%);--l3-background-transparent:color-mix(in srgb,var(--bg-neutral-light-800),transparent 100%);--l3-background-60:color-mix(in srgb,var(--bg-neutral-light-800),transparent 40%);--alert-strip-button-background:color-mix(in srgb,var(--bg-ink-400),transparent 40%);--callout-primary-background:color-mix(in srgb,var(--bg-robin-500),transparent 90%);--callout-primary-border:color-mix(in srgb,var(--bg-robin-500),transparent 80%);--callout-primary-title:var(--bg-robin-600);--callout-primary-description:var(--bg-robin-600);--callout-primary-icon:var(--bg-robin-300);--callout-success-background:color-mix(in srgb,var(--bg-forest-600),transparent 90%);--callout-success-border:color-mix(in srgb,var(--bg-forest-600),transparent 80%);--callout-success-title:var(--bg-forest-600);--callout-success-description:var(--bg-forest-600);--callout-success-icon:var(--bg-forest-700);--callout-warning-background:color-mix(in srgb,var(--bg-amber-600),transparent 90%);--callout-warning-border:color-mix(in srgb,var(--bg-amber-600),transparent 80%);--callout-warning-title:var(--bg-amber-700);--callout-warning-description:var(--bg-amber-700);--callout-warning-icon:var(--bg-amber-800);--callout-error-background:color-mix(in srgb,var(--bg-cherry-500),transparent 90%);--callout-error-border:color-mix(in srgb,var(--bg-cherry-500),transparent 80%);--callout-error-title:var(--bg-cherry-600);--callout-error-description:var(--bg-cherry-600);--callout-error-icon:var(--bg-cherry-700);--accent-primary:var(--bg-robin-500);--accent-primary-hover:var(--bg-robin-400);--accent-primary-foreground:var(--text-vanilla-100);--accent-forest:var(--bg-forest-500);--accent-forest-hover:var(--bg-forest-400);--accent-forest-foreground:var(--text-vanilla-100);--accent-amber:var(--bg-amber-500);--accent-amber-hover:var(--bg-amber-400);--accent-amber-foreground:var(--text-vanilla-100);--accent-cherry:var(--bg-cherry-500);--accent-cherry-hover:var(--bg-cherry-400);--accent-cherry-foreground:var(--text-vanilla-100);--accent-aqua:var(--bg-aqua-500);--accent-aqua-hover:var(--bg-aqua-400);--accent-aqua-foreground:var(--text-vanilla-100);--accent-sakura:var(--bg-sakura-500);--accent-sakura-hover:var(--bg-sakura-400);--accent-sakura-foreground:var(--text-vanilla-100);--accent-sienna:var(--bg-sienna-500);--accent-sienna-hover:var(--bg-sienna-400);--accent-sienna-foreground:var(--text-vanilla-100)}
[data-theme=default].dark{color-scheme:dark;--background:var(--bg-ink-500);--foreground:var(--text-vanilla-400);--card:var(--bg-ink-400);--card-foreground:var(--text-vanilla-100);--popover:var(--bg-ink-400);--popover-foreground:var(--text-vanilla-100);--primary:var(--bg-robin-500);--secondary:var(--bg-slate-500);--muted:var(--bg-slate-500);--muted-foreground:var(--text-vanilla-400);--accent:var(--bg-slate-300);--accent-foreground:var(--text-vanilla-100);--destructive:var(--bg-cherry-500);--destructive-foreground:var(--text-ink-500);--border:var(--bg-slate-400);--input:var(--bg-slate-300);--ring:var(--bg-robin-500);--radius:0.25rem;--chart-1:var(--bg-robin-400);--chart-2:var(--bg-robin-500);--chart-3:var(--bg-robin-600);--chart-4:var(--bg-slate-200);--chart-5:var(--bg-slate-300);--sidebar:var(--bg-slate-500);--sidebar-foreground:var(--text-vanilla-400);--sidebar-primary:var(--bg-robin-500);--sidebar-primary-foreground:var(--text-ink-500);--sidebar-accent:var(--bg-slate-400);--sidebar-accent-foreground:var(--text-vanilla-400);--sidebar-border:var(--bg-slate-500);--sidebar-ring:var(--bg-robin-500);--font-sans:"Inter";--font-serif:"Open Sans";--font-mono:"Geist Mono";--base-white:var(--text-base-white);--base-black:var(--text-base-black);--l1-background:var(--bg-neutral-dark-1000);--l2-background:var(--bg-neutral-dark-900);--l3-background:var(--bg-neutral-dark-800);--l1-background-hover:var(--bg-neutral-dark-900);--l2-background-hover:var(--bg-neutral-dark-700);--l3-background-hover:var(--bg-neutral-dark-700);--l1-foreground:var(--text-neutral-dark-50);--l1-foreground-hover:var(--text-base-white);--l2-foreground:var(--text-neutral-dark-100);--l2-foreground-hover:var(--text-neutral-dark-50);--l3-foreground:var(--text-neutral-dark-200);--l3-foreground-hover:var(--text-neutral-dark-300);--l1-border:var(--bg-neutral-dark-900);--l2-border:var(--bg-neutral-dark-800);--l3-border:var(--bg-neutral-dark-700);--primary-background:var(--bg-robin-500);--primary-background-hover:var(--bg-robin-400);--primary-foreground:var(--text-neutral-dark-50);--primary-foreground-hover:var(--text-base-white);--secondary-background:var(--bg-neutral-dark-900);--secondary-background-hover:var(--bg-neutral-dark-700);--secondary-foreground:var(--text-neutral-dark-100);--secondary-foreground-hover:var(--text-neutral-dark-50);--secondary-border:var(--bg-neutral-dark-800);--success-background:var(--bg-forest-600);--success-background-hover:var(--bg-forest-400);--success-foreground:var(--text-neutral-dark-50);--success-foreground-hover:var(--text-base-white);--warning-background:var(--bg-amber-600);--warning-background-hover:var(--bg-amber-400);--warning-foreground:var(--text-neutral-dark-50);--warning-foreground-hover:var(--text-base-white);--danger-background:var(--bg-cherry-500);--danger-background-hover:var(--bg-cherry-400);--danger-foreground:var(--text-neutral-dark-50);--danger-foreground-hover:var(--text-base-white);--l1-background-transparent:color-mix(in srgb,var(--bg-neutral-dark-1000),transparent 100%);--l1-background-60:color-mix(in srgb,var(--bg-neutral-dark-1000),transparent 40%);--l2-background-transparent:color-mix(in srgb,var(--bg-neutral-dark-900),transparent 100%);--l2-background-60:color-mix(in srgb,var(--bg-neutral-dark-900),transparent 40%);--l3-background-transparent:color-mix(in srgb,var(--bg-neutral-dark-800),transparent 100%);--l3-background-60:color-mix(in srgb,var(--bg-neutral-dark-800),transparent 40%);--callout-primary-background:color-mix(in srgb,var(--bg-robin-500),transparent 90%);--callout-primary-border:color-mix(in srgb,var(--bg-robin-500),transparent 80%);--callout-primary-title:var(--bg-robin-400);--callout-primary-description:var(--bg-robin-400);--callout-primary-icon:var(--bg-robin-300);--callout-success-background:color-mix(in srgb,var(--bg-forest-600),transparent 90%);--callout-success-border:color-mix(in srgb,var(--bg-forest-600),transparent 80%);--callout-success-title:var(--bg-forest-400);--callout-success-description:var(--bg-forest-400);--callout-success-icon:var(--bg-forest-300);--callout-warning-background:color-mix(in srgb,var(--bg-amber-600),transparent 90%);--callout-warning-border:color-mix(in srgb,var(--bg-amber-600),transparent 80%);--callout-warning-title:var(--bg-amber-400);--callout-warning-description:var(--bg-amber-400);--callout-warning-icon:var(--bg-amber-300);--callout-error-background:color-mix(in srgb,var(--bg-cherry-500),transparent 90%);--callout-error-border:color-mix(in srgb,var(--bg-cherry-500),transparent 80%);--callout-error-title:var(--bg-cherry-400);--callout-error-description:var(--bg-cherry-400);--callout-error-icon:var(--bg-cherry-300);--accent-primary:var(--bg-robin-500);--accent-primary-hover:var(--bg-robin-400);--accent-primary-foreground:var(--text-ink-500);--accent-forest:var(--bg-forest-500);--accent-forest-hover:var(--bg-forest-400);--accent-forest-foreground:var(--text-ink-500);--accent-amber:var(--bg-amber-500);--accent-amber-hover:var(--bg-amber-400);--accent-amber-foreground:var(--text-ink-500);--accent-cherry:var(--bg-cherry-500);--accent-cherry-hover:var(--bg-cherry-400);--accent-cherry-foreground:var(--text-ink-500);--accent-aqua:var(--bg-aqua-500);--accent-aqua-hover:var(--bg-aqua-400);--accent-aqua-foreground:var(--text-ink-500);--accent-sakura:var(--bg-sakura-500);--accent-sakura-hover:var(--bg-sakura-400);--accent-sakura-foreground:var(--text-ink-500);--accent-sienna:var(--bg-sienna-500);--accent-sienna-hover:var(--bg-sienna-400);--accent-sienna-foreground:var(--text-ink-500)}
/* Import fonts from CDN */
.periscope-btn-group {
  display: inline-flex;
}
.periscope-btn-group .ant-btn {
  border-radius: 0;
}
.periscope-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 6px;
  border: 1px solid var(--bg-slate-400, #1d212d);
  border-radius: 3px;
  background: var(--bg-ink-400, #121317);
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
  color: var(--bg-vanilla-400, #c0c1c3);
}
.periscope-btn.ghost {
  box-shadow: none;
  border: none;
  background: transparent;
  color: var(--bg-vanilla-400, #c0c1c3);
}
.periscope-btn {
  cursor: pointer;
}
.periscope-btn.primary {
  color: var(--bg-vanilla-100) !important;
  background-color: var(--bg-robin-500) !important;
  border: none;
  box-shadow: 0 2px 0 rgba(62, 86, 245, 0.09);
}
.periscope-btn.secondary {
  border-radius: 3px;
  border: 1px solid var(--Slate-300, #242834);
  background: var(--Ink-200, #23262e);
}
.periscope-btn:disabled {
  opacity: 0.5;
}
.periscope-btn.link {
  color: var(--Vanilla-400, #c0c1c3);
  border: none;
  box-shadow: none;
  background: transparent;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: -0.07px;
  line-height: 20px;
}
.periscope-btn.link:hover {
  color: var(--bg-vanilla-100) !important;
  background-color: transparent !important;
}
.periscope-btn.text {
  color: var(--bg-vanilla-100) !important;
  background-color: transparent !important;
  border: none;
  box-shadow: none;
  box-shadow: none;
  padding: 4px 4px;
}
.periscope-btn.text:hover {
  color: var(--bg-vanilla-300) !important;
  background-color: transparent !important;
}
.periscope-btn.success {
  color: var(--bg-forest-400) !important;
  border-radius: 2px;
  border: 1px solid rgba(37, 225, 146, 0.1);
  background: rgba(37, 225, 146, 0.1) !important;
  box-shadow: none !important;
}
.periscope-btn.warning {
  color: var(--bg-amber-500) !important;
  border-radius: 2px;
  border: 1px solid rgba(255, 184, 0, 0.1);
  background: rgba(255, 184, 0, 0.1) !important;
  box-shadow: none !important;
}
.periscope-btn.danger {
  border-radius: 2px;
  color: var(--text-vanilla-100) !important;
  background: var(--bg-cherry-500) !important;
  text-align: center;
  font-variant-numeric: slashed-zero;
  box-shadow: none !important;
}
.periscope-btn.danger:hover {
  border: 1px solid var(--bg-cherry-600) !important;
}
.periscope-tab {
  display: flex;
  align-items: center;
  gap: 8px;
}
.periscope-input.borderless {
  border: none;
  border-radius: 0;
}
.periscope-input-with-label {
  display: flex;
  flex-direction: row;
  border-radius: 2px 0px 0px 2px;
}
.periscope-input-with-label .label {
  font-size: 12px;
  color: var(--bg-vanilla-400);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: 0.56px;
  max-width: 150px;
  min-width: 80px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0px 8px;
  border-radius: 2px 0px 0px 2px;
  border: 1px solid var(--bg-slate-400);
  background: var(--bg-ink-300);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-weight: var(--font-weight-light);
}
.periscope-input-with-label .input {
  flex: 1;
  border-radius: 0px 2px 2px 0px;
  border: 1px solid var(--bg-slate-400);
  border-right: none;
  border-left: none;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  background: var(--bg-ink-300);
  min-width: 0;
}
.periscope-input-with-label .input .ant-select {
  font-family: "Space Mono", monospace !important;
  border: none;
  height: 36px;
}
.periscope-input-with-label .input .ant-select .ant-select-selection-search-input {
  min-width: max-content !important;
  max-width: 100% !important;
}
.periscope-input-with-label .input .ant-select-selector {
  border: none;
}
.periscope-input-with-label .input .ant-select-selection-placeholder {
  color: var(--bg-vanilla-400);
}
.periscope-input-with-label .close-btn {
  border-radius: 0px 2px 2px 0px;
  border: 1px solid var(--bg-slate-400);
  background: var(--bg-ink-300);
  height: 38px;
  width: 38px;
}
.lightMode .periscope-btn {
  border-color: var(--bg-vanilla-300);
  background: var(--bg-vanilla-100);
  color: var(--bg-ink-200);
}
.lightMode .periscope-btn.text {
  color: var(--bg-ink-200) !important;
}
.lightMode .periscope-btn.text:hover {
  color: var(--bg-ink-300) !important;
}
.lightMode .periscope-input-with-label .label {
  color: var(--bg-ink-500) !important;
  border: 1px solid var(--bg-vanilla-300) !important;
  background: var(--bg-vanilla-100) !important;
}
.lightMode .periscope-input-with-label .input {
  border: 1px solid var(--bg-vanilla-300) !important;
  background: var(--bg-vanilla-100) !important;
}
.lightMode .periscope-input-with-label .close-btn {
  border: 1px solid var(--bg-vanilla-300) !important;
  background: var(--bg-vanilla-100) !important;
}
#root,
html,
body {
  height: 100%;
  overflow: hidden;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
body {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
  }
}
.u-legend {
  max-height: 30px;
  overflow-y: auto;
  overflow-x: hidden;
}
.u-legend::-webkit-scrollbar {
  width: 0.5rem;
}
.u-legend::-webkit-scrollbar-corner {
  background: transparent;
}
.u-legend::-webkit-scrollbar-thumb {
  background: rgb(136, 136, 136);
  border-radius: 0.625rem;
}
.u-legend::-webkit-scrollbar-track {
  background: transparent;
}
.u-legend tr.u-series th {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  -webkit-font-smoothing: antialiased;
}
.u-legend tr.u-series th .u-marker {
  border-radius: 50%;
}
.u-legend tr.u-series.u-off {
  text-decoration: line-through;
  text-decoration-thickness: 3px;
}
.u-legend.u-legend-enhanced {
  max-height: none;
  padding: 6px 4px;
}
.u-legend.u-legend-enhanced::-webkit-scrollbar {
  width: 0.25rem;
  height: 0.25rem;
}
.u-legend.u-legend-enhanced::-webkit-scrollbar-thumb {
  background: rgba(136, 136, 136, 0.4);
  border-radius: 0.125rem;
}
.u-legend.u-legend-enhanced::-webkit-scrollbar-thumb:hover {
  background: rgba(136, 136, 136, 0.7);
}
.u-legend.u-legend-enhanced::-webkit-scrollbar-track {
  background: transparent;
}
.u-legend.u-legend-enhanced table {
  width: 100%;
  table-layout: fixed;
}
.u-legend.u-legend-enhanced tbody {
  display: flex;
  flex-wrap: wrap;
  gap: 1px 2px;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
}
.u-legend.u-legend-enhanced.u-legend-single-line tbody {
  justify-content: center;
}
.u-legend.u-legend-enhanced.u-legend-right-aligned tbody {
  align-items: flex-start !important;
  justify-content: flex-start !important;
}
.u-legend.u-legend-enhanced.u-legend-right-aligned tr.u-series {
  justify-content: flex-start !important;
}
.u-legend.u-legend-enhanced.u-legend-right-aligned tr.u-series th {
  justify-content: flex-start !important;
  text-align: left !important;
}
.u-legend.u-legend-enhanced.u-legend-right-aligned tr.u-series th .legend-text {
  text-align: left !important;
}
.u-legend.u-legend-enhanced.u-legend-right tbody {
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 2px;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series {
  width: 100%;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series th {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  justify-content: flex-start;
  cursor: pointer;
  position: relative;
  min-width: 0;
  width: 100%;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series th .u-marker {
  border-radius: 50%;
  min-width: 11px;
  min-height: 11px;
  width: 11px;
  height: 11px;
  flex-shrink: 0;
  cursor: pointer;
  transition: transform 0.2s ease;
  position: relative;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series th .u-marker:hover {
  transform: scale(1.2);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.3);
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series th .u-marker:active {
  transform: scale(0.9);
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series th .legend-text {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  min-width: 0;
  flex: 1;
  padding-bottom: 2px;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series th[title] {
  cursor: pointer;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series th:hover {
  background: rgba(255, 255, 255, 0.05);
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series.u-off {
  opacity: 0.5;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series.u-off th:hover {
  opacity: 0.7;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series.u-off th .u-marker {
  opacity: 0.3;
  position: relative;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series.u-off th .u-marker::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 2px;
  background: #ff4444;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series.u-off th .u-marker:hover {
  opacity: 0.6;
}
.u-legend.u-legend-enhanced.u-legend-right tr.u-series:focus {
  outline: 1px solid rgba(66, 165, 245, 0.8);
  outline-offset: 1px;
}
.u-legend.u-legend-enhanced.u-legend-bottom tbody {
  flex-direction: row;
  flex-wrap: wrap;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series {
  display: flex;
  flex: 0 0 auto;
  min-width: fit-content;
  max-width: 200px;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series th {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 10px;
  cursor: pointer;
  white-space: nowrap;
  -webkit-font-smoothing: antialiased;
  border-radius: 2px;
  min-width: 0;
  max-width: 100%;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series th:hover {
  background: rgba(255, 255, 255, 0.05);
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series th .u-marker {
  border-radius: 50%;
  min-width: 11px;
  min-height: 11px;
  width: 11px;
  height: 11px;
  flex-shrink: 0;
  cursor: pointer;
  transition: transform 0.2s ease;
  position: relative;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series th .u-marker:hover {
  transform: scale(1.2);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.3);
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series th .u-marker:active {
  transform: scale(0.9);
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series th .legend-text {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  min-width: 0;
  flex: 1;
  padding-bottom: 2px;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series th[title] {
  cursor: pointer;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series.u-off {
  opacity: 0.5;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series.u-off th:hover {
  opacity: 0.7;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series.u-off th .u-marker {
  opacity: 0.3;
  position: relative;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series.u-off th .u-marker::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 2px;
  background: #ff4444;
  transform: translate(-50%, -50%) rotate(45deg);
  border-radius: 1px;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series.u-off th .u-marker:hover {
  opacity: 0.6;
}
.u-legend.u-legend-enhanced.u-legend-bottom tr.u-series:focus {
  outline: 1px solid rgba(66, 165, 245, 0.8);
  outline-offset: 1px;
}
.uplot.u-plot-right-legend {
  display: flex;
  flex-direction: row;
}
.uplot.u-plot-right-legend .u-over {
  flex: 1;
}
.uplot.u-plot-right-legend .u-legend {
  flex-shrink: 0;
  margin-top: 0;
  margin-bottom: 0;
}
.uplot.u-plot-bottom-legend {
  display: flex;
  flex-direction: column;
}
.uplot.u-plot-bottom-legend .u-legend {
  margin-top: 10px;
  margin-left: 0;
  margin-right: 0;
}
/* Style the selected background */
.u-select {
  background: rgba(0, 0, 0, 0.5) !important;
}
#overlay {
  font-family: "Inter";
  font-size: 12px;
  position: absolute;
  margin: 0.5rem;
  background: var(--bg-ink-300);
  -webkit-font-smoothing: antialiased;
  color: var(--bg-vanilla-100);
  z-index: 10000;
  overflow: auto;
  max-height: 480px !important;
  max-width: 300px !important;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
#overlay .tooltip-container {
  padding: 1rem;
}
#overlay::-webkit-scrollbar {
  width: 0.3rem;
}
#overlay::-webkit-scrollbar-corner {
  background: transparent;
}
#overlay::-webkit-scrollbar-thumb {
  background: rgb(136, 136, 136);
  border-radius: 0.625rem;
}
#overlay::-webkit-scrollbar-track {
  background: transparent;
}
.tooltip-content-row {
  display: flex;
  align-items: center;
  gap: 4px;
}
.uplot {
  width: 100%;
  height: 100%;
}
::-webkit-scrollbar {
  height: 1rem;
  width: 0.5rem;
}
::-webkit-scrollbar:horizontal {
  height: 0.5rem;
  width: 1rem;
}
::-webkit-scrollbar-track {
  background-color: transparent;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb {
  --tw-border-opacity: 1;
  background-color: rgba(217, 217, 227, 0.8);
  border-color: rgba(255, 255, 255, var(--tw-border-opacity));
  border-radius: 9999px;
  border-width: 1px;
}
::-webkit-scrollbar-thumb:hover {
  --tw-bg-opacity: 1;
  background-color: rgba(236, 236, 241, var(--tw-bg-opacity));
}
.flexBtn {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ant-dropdown-menu {
  margin-top: 2px;
  min-width: 160px;
  border-radius: 4px;
  padding: 16px;
  border: 1px solid var(--bg-slate-400, #1d212d);
  background: linear-gradient(139deg, rgba(18, 19, 23, 0.8) 0%, rgba(18, 19, 23, 0.9) 98.68%);
  box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(20px);
}
.ant-dropdown-menu .ant-dropdown-menu-item-group-title {
  font-size: 11px;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: 0.08em;
  text-align: left;
}
.ant-dropdown-menu .ant-dropdown-menu-item-group .ant-dropdown-menu-item-group-list {
  margin: 0 !important;
}
.ant-dropdown-menu .ant-dropdown-menu-item-group .ant-dropdown-menu-item-group-list .ant-dropdown-menu-item {
  font-size: 13px;
  font-weight: 400;
  line-height: 17px;
  letter-spacing: 0.01em;
  text-align: left;
}
.ant-dropdown-menu-submenu-popup {
  padding: 0 !important;
  z-index: 1050 !important;
  box-shadow: none !important;
  border: 0 !important;
}
.ant-picker-panels > *:first-child button.ant-picker-header-next-btn {
  visibility: visible !important;
}
.ant-picker-panels > *:first-child button.ant-picker-header-super-next-btn {
  visibility: visible !important;
}
.ant-picker-panels > *:last-child:not(:only-child) {
  display: none !important;
}
.ant-picker-panel-container,
.ant-picker-footer-extra > div {
  flex-wrap: wrap !important;
}
.ant-picker-range-arrow {
  display: none !important;
}
.ant-picker-panel-container {
  background: none !important;
  box-shadow: none !important;
}
.ant-tooltip {
  --antd-arrow-background-color: var(--l2-background);
}
.ant-tooltip .ant-tooltip-inner {
  background-color: var(--l2-background);
}
.ant-tooltip .flexBtn {
  display: flex;
  align-items: center;
  gap: 8px;
}
.members-count {
  display: inline-block;
  margin-left: 8px;
  margin-right: 8px;
}
.lightMode #overlay {
  color: var(--bg-ink-500);
  background: var(--bg-vanilla-100);
  border: 1px solid var(--bg-vanilla-300);
}
.lightMode .ant-tooltip {
  --antd-arrow-background-color: var(--bg-vanilla-100);
}
.lightMode .ant-tooltip .ant-tooltip-inner {
  background-color: var(--bg-vanilla-100);
  color: var(---bg-ink-500);
}
.lightMode .ant-dropdown-menu {
  border: 1px solid var(--bg-vanilla-300);
  background: var(--bg-vanilla-100);
  box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
}
.lightMode .ant-dropdown-menu-item:hover {
  background-color: var(--bg-vanilla-300) !important;
}
.lightMode .ant-dropdown-menu-item:hover.ant-dropdown-menu-item-danger {
  background-color: var(--bg-cherry-500) !important;
}
.lightMode .u-legend-enhanced::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
}
.lightMode .u-legend-enhanced::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.4);
}
.lightMode .u-legend-enhanced.u-legend-bottom tr.u-series th:hover {
  background: rgba(0, 0, 0, 0.05);
}
.lightMode .u-legend-enhanced.u-legend-bottom tr.u-series.u-off {
  opacity: 0.5;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}
.lightMode .u-legend-enhanced.u-legend-bottom tr.u-series.u-off th:hover {
  background: rgba(0, 0, 0, 0.08);
  opacity: 0.7;
}
.lightMode .u-legend-enhanced.u-legend-bottom tr.u-series.u-off th .u-marker {
  opacity: 0.3;
}
.lightMode .u-legend-enhanced.u-legend-bottom tr.u-series.u-off th .u-marker::after {
  background: #cc3333;
}
.lightMode .u-legend-enhanced.u-legend-bottom tr.u-series.u-off th .u-marker:hover {
  opacity: 0.6;
}
.lightMode .u-legend-enhanced.u-legend-bottom tr.u-series:focus {
  outline: 1px solid rgba(25, 118, 210, 0.8);
}
.lightMode .u-legend-enhanced.u-legend-right tr.u-series th:hover {
  background: rgba(0, 0, 0, 0.05);
}
.lightMode .u-legend-enhanced.u-legend-right tr.u-series.u-off {
  opacity: 0.5;
  text-decoration: line-through;
  text-decoration-thickness: 1px;
}
.lightMode .u-legend-enhanced.u-legend-right tr.u-series.u-off th:hover {
  background: rgba(0, 0, 0, 0.08);
  opacity: 0.7;
}
.lightMode .u-legend-enhanced.u-legend-right tr.u-series.u-off th .u-marker {
  opacity: 0.3;
}
.lightMode .u-legend-enhanced.u-legend-right tr.u-series.u-off th .u-marker::after {
  background: #cc3333;
}
.lightMode .u-legend-enhanced.u-legend-right tr.u-series.u-off th .u-marker:hover {
  opacity: 0.6;
}
.lightMode .u-legend-enhanced.u-legend-right tr.u-series:focus {
  outline: 1px solid rgba(25, 118, 210, 0.8);
}
.ant-notification-notice-message {
  padding-right: 20px;
}
.intercom-lightweight-app {
  z-index: 980 !important;
}
/**

z-index chart for components across application

intercom        -  980
tooltip			-  1070
popover 		-  1030
drawer  		-  1000
time picker 	-  1050
dropdown 		-  1050
modal 			-  1000
notifications	-  2050

*/
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.animate-spin {
  animation: spin 1s linear infinite;
}
.legend-tooltip {
  position: fixed;
  background: var(--bg-slate-400);
  color: var(--text-vanilla-100);
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-family: "Geist Mono";
  font-weight: 500;
  z-index: 10000;
  pointer-events: none;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  border: 1px solid #374151;
  -webkit-font-smoothing: antialiased;
  letter-spacing: 0.025em;
}
.lightMode .legend-tooltip {
  background: #ffffff;
  color: #1f2937;
  border: 1px solid #d1d5db;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.metrics-application-container,
.service-metric-table-container,
.service-traces-table-container {
  padding: 0px 8px;
}
.ap-dex-settings-popover-content {
  display: flex;
  width: 100%;
  justify-content: flex-end;
}
.service-map-container {
  padding: 0px 8px;
}
.cursor-pointer {
  cursor: pointer;
}