:root {
  color-scheme: dark;
  --bg: #060606;
  --fg: #e6e6e6;
}

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
  background: var(--bg);
  color: var(--fg);
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
}

body {
  min-height: 100dvh;
  touch-action: none;
}

#organism {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100dvh;
  display: block;
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.05), transparent 38%),
    #060606;
}

#organism.no-webgl {
  background:
    radial-gradient(circle at 50% 45%, rgba(255, 255, 255, 0.055), transparent 32%),
    radial-gradient(circle at 50% 50%, transparent 52%, rgba(0, 0, 0, 0.46)),
    #050505;
}

.site-shell {
  position: relative;
  z-index: 1;
  min-height: 100dvh;
  pointer-events: none;
  padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right))
    max(18px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
}
