@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-Thin.0ba8e807.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-ThinItalic.b7345a72.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-ExtraLight.a017581e.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-ExtraLightItalic.74a69601.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-Light.9042b07e.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-LightItalic.18bc9f1c.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-Regular.1e47cc70.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-Italic.5cd3a292.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-Medium.5a9db70e.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-MediumItalic.6dcf3f29.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-SemiBold.d938fffb.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-SemiBoldItalic.b25564dc.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-Bold.e11ef446.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-BoldItalic.6d6bbb7f.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-ExtraBold.c62c69d9.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-ExtraBoldItalic.63fe3fdd.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-Black.c947c899.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Display;
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterDisplay-BlackItalic.b3b8f336.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-Thin.a9bd55be.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 100;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-ThinItalic.07713e8c.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-ExtraLight.80c327c5.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 200;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-ExtraLightItalic.189d3d69.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-Light.2a7cd067.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-LightItalic.b600032e.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-Regular.d080ae18.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-Italic.0c8fa6f6.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-Medium.242d04be.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-MediumItalic.792bf8e5.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-SemiBold.cac2ba46.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-SemiBoldItalic.c2b059d8.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-Bold.11d5bc9f.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-BoldItalic.0110b6a0.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-ExtraBold.969298c8.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-ExtraBoldItalic.66e3fe64.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-Black.3a20fb7d.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: italic;
  font-weight: 900;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/Inter-BlackItalic.01ea7961.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Variable;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterVariable.ff710c09.woff2)
    format("woff2");
}
@font-face {
  font-family: Inter Variable;
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url(https://play.hyper.space/_next/static/media/InterVariable-Italic.ef0ecaff.woff2)
    format("woff2");
}

body {
  font-family: Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.font-mono {
  font-family: Space Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
    Liberation Mono, Courier New, monospace;
}
.font-prose {
  font-family: Marat Sans, ui-sans-serif, system-ui, sans-serif,
    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
}
.font-sans {
  font-family: Inter, ui-sans-serif, system-ui, sans-serif, Apple Color Emoji,
    Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
}

#sidebar {
  transition: transform 0.2s ease, width 0.2s ease;
  transform: translateX(0);
}

#sidebar.sidebar-collapsed {
  transform: translateX(100%);
  transition: transform 0.2s ease, width 0.2s ease;

  width: 0;
}

#right-collapse {
  position: absolute;
  top: 16px;
  left: -24px;
  cursor: pointer;
  z-index: 10;
}

#right-collapse svg.rotate-180 {
  transform: rotate(180deg);
}

.scroll-container {
  display: flex;
  overflow-x: scroll;
  width: 100%;
  gap: 15px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

#scroll-container::-webkit-scrollbar {
  display: none;
}

#scroll-container {
  scroll-behavior: smooth;
}

.scroll-container:active {
  cursor: grabbing;
}

body.blurred {
  filter: blur(5px);
  transition: filter 0.3s ease;
}

#popoverMenu {
  transform: translateY(-20px);
  transition: all 0.3s ease;
}

#popoverMenu:not(.hidden) {
  transform: translateY(0);
}

#overlay {
  display: none;
  background-color: rgba(255, 255, 255, 0.8);
  position: fixed;
  inset: 0;
  z-index: 40;
  transition: all 0.3s ease;
}

#overlay.hidden {
  display: none;
}

#sliding-sheet-r {
  transition: transform 0.3s ease;
  transform: translateX(100%);
}

#sliding-sheet-r.open {
  transform: translateX(0%);
}

#sliding-sheet-l {
  transition: transform 0.3s ease;
  transform: translateX(-100%);
}

#sliding-sheet-l.open {
  transform: translateX(0%);
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

#data-sheet.active {
  transform: translateX(0);
}