Update dialog.

* Use the free function isntead of clearing the snow count directly.

* Also initialize the queue count to 0 if re-allocated.

.gitignore

@@ -13,8 +13,12 @@ RecompiledPatches/
 
 # Linux build output
 build/
+build-cmake/
 *.o
 
+# Flatpak build process
+repo/
+
 # Windows build output
 *.exe
 *.dll

.gitmodules

@@ -1,24 +1,15 @@
 [submodule "lib/N64ModernRuntime"]
 	path = lib/N64ModernRuntime
 	url = https://github.com/N64Recomp/N64ModernRuntime
-[submodule "lib/RmlUi"]
-	path = lib/RmlUi
-	url = https://github.com/mikke89/RmlUi
-[submodule "lib/freetype-windows-binaries"]
-	path = lib/freetype-windows-binaries
-	url = https://github.com/ubawurinna/freetype-windows-binaries/
-[submodule "lib/lunasvg"]
-	path = lib/lunasvg
-	url = https://github.com/sammycage/lunasvg
 [submodule "lib/rt64"]
 	path = lib/rt64
 	url = https://github.com/rt64/rt64
-[submodule "lib/slot_map"]
-	path = lib/slot_map
-	url = https://github.com/SergeyMakeev/slot_map
 [submodule "lib/bk-decomp"]
 	path = lib/bk-decomp
 	url = https://gitlab.com/banjo.decomp/banjo-kazooie
 [submodule "BanjoRecompSyms"]
 	path = BanjoRecompSyms
 	url = https://github.com/BanjoRecomp/BanjoRecompSyms
+[submodule "lib/RecompFrontend"]
+	path = lib/RecompFrontend
+	url = https://github.com/N64Recomp/RecompFrontend

CMakeLists.txt

@@ -51,15 +51,7 @@ endif()
 
 add_subdirectory(${CMAKE_SOURCE_DIR}/lib/rt64 ${CMAKE_BINARY_DIR}/rt64)
 
-# set(BUILD_SHARED_LIBS_SAVED "${BUILD_SHARED_LIBS}")
 set(BUILD_SHARED_LIBS OFF)
-SET(LUNASVG_BUILD_EXAMPLES OFF CACHE BOOL "" FORCE)
-add_subdirectory(${CMAKE_SOURCE_DIR}/lib/lunasvg)
-# set(BUILD_SHARED_LIBS "${BUILD_SHARED_LIBS_SAVED}")
-SET(RMLUI_SVG_PLUGIN ON CACHE BOOL "" FORCE)
-SET(RMLUI_TESTS_ENABLED OFF CACHE BOOL "" FORCE)
-add_subdirectory(${CMAKE_SOURCE_DIR}/lib/RmlUi)
-target_compile_definitions(rmlui_core PRIVATE LUNASVG_BUILD_STATIC)
 
 add_subdirectory(${CMAKE_SOURCE_DIR}/lib/N64ModernRuntime)
 
@@ -148,84 +140,49 @@ add_custom_command(OUTPUT
 add_executable(BanjoRecompiled)
 
 set (SOURCES
+    ${CMAKE_SOURCE_DIR}/src/main/launcher_animation.cpp
     ${CMAKE_SOURCE_DIR}/src/main/main.cpp
-    ${CMAKE_SOURCE_DIR}/src/main/support.cpp
     ${CMAKE_SOURCE_DIR}/src/main/register_overlays.cpp
     ${CMAKE_SOURCE_DIR}/src/main/register_patches.cpp
-    ${CMAKE_SOURCE_DIR}/src/main/rt64_render_context.cpp
     ${CMAKE_SOURCE_DIR}/src/main/theme.cpp
 
-    ${CMAKE_SOURCE_DIR}/src/game/input.cpp
-    ${CMAKE_SOURCE_DIR}/src/game/controls.cpp
     ${CMAKE_SOURCE_DIR}/src/game/config.cpp
     ${CMAKE_SOURCE_DIR}/src/game/debug.cpp
     ${CMAKE_SOURCE_DIR}/src/game/recomp_api.cpp
-    ${CMAKE_SOURCE_DIR}/src/game/recomp_actor_api.cpp
+    ${CMAKE_SOURCE_DIR}/src/game/recomp_extension_api.cpp
     ${CMAKE_SOURCE_DIR}/src/game/recomp_data_api.cpp
     ${CMAKE_SOURCE_DIR}/src/game/rom_decompression.cpp
 
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_renderer.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_state.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_launcher.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_config.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_prompt.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_config_sub_menu.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_color_hack.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_rml_hacks.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_elements.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_mod_details_panel.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_mod_installer.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_mod_menu.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_api.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_api_events.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_api_images.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/ui_utils.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/util/hsv.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/core/ui_context.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_button.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_clickable.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_container.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_element.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_image.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_label.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_radio.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_scroll_container.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_slider.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_span.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_style.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_text_input.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_theme.cpp
-    ${CMAKE_SOURCE_DIR}/src/ui/elements/ui_toggle.cpp
-
     ${CMAKE_SOURCE_DIR}/rsp/n_aspMain.cpp
-
-    ${CMAKE_SOURCE_DIR}/lib/RmlUi/Backends/RmlUi_Platform_SDL.cpp
 )
 
-if (APPLE)
-    list(APPEND SOURCES ${CMAKE_SOURCE_DIR}/src/main/support_apple.mm)
-endif()
-
 target_include_directories(BanjoRecompiled PRIVATE
     ${CMAKE_SOURCE_DIR}/include
     ${CMAKE_SOURCE_DIR}/lib/N64ModernRuntime/N64Recomp/include
     ${CMAKE_SOURCE_DIR}/lib/concurrentqueue
-    ${CMAKE_SOURCE_DIR}/lib/GamepadMotionHelpers
-    ${CMAKE_SOURCE_DIR}/lib/RmlUi/Include
-    ${CMAKE_SOURCE_DIR}/lib/RmlUi/Backends
     ${CMAKE_SOURCE_DIR}/lib/rt64/src/contrib
     ${CMAKE_SOURCE_DIR}/lib/rt64/src/contrib/hlslpp/include
     ${CMAKE_SOURCE_DIR}/lib/rt64/src/contrib/dxc/inc
     ${CMAKE_SOURCE_DIR}/lib/rt64/src
     ${CMAKE_SOURCE_DIR}/lib/rt64/src/rhi
     ${CMAKE_SOURCE_DIR}/lib/rt64/src/render
+    ${CMAKE_SOURCE_DIR}/lib/RecompFrontend/recompinput/include
+    ${CMAKE_SOURCE_DIR}/lib/RecompFrontend/recompui/include
+    ${CMAKE_SOURCE_DIR}/lib/RecompFrontend/recompui/src
     ${CMAKE_SOURCE_DIR}/lib/freetype-windows-binaries/include
     ${CMAKE_SOURCE_DIR}/lib/rt64/src/contrib/nativefiledialog-extended/src/include
-    ${CMAKE_SOURCE_DIR}/lib/slot_map/slot_map
-    ${CMAKE_BINARY_DIR}/shaders
+    ${CMAKE_SOURCE_DIR}/lib/SlotMap
     ${CMAKE_CURRENT_BINARY_DIR}
 )
 
+# Generate icon_bytes.c from the app icon PNG.
+add_custom_command(OUTPUT ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.c ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.h
+    COMMAND file_to_c ${CMAKE_SOURCE_DIR}/icons/app.png icon_bytes ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.c ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.h
+    DEPENDS ${CMAKE_SOURCE_DIR}/icons/app.png
+)
+
+target_sources(BanjoRecompiled PRIVATE ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.c)
+
 if(CMAKE_SIZEOF_VOID_P EQUAL 8 AND CMAKE_SYSTEM_PROCESSOR MATCHES "x86_64|amd64|AMD64")
     target_compile_options(BanjoRecompiled PRIVATE
         -march=nehalem
@@ -285,12 +242,12 @@ if (WIN32)
         PROPERTIES
             LINK_FLAGS_DEBUG "/SUBSYSTEM:CONSOLE"
             LINK_FLAGS_RELEASE "/SUBSYSTEM:WINDOWS /ENTRY:mainCRTStartup"
-            LINK_FLAGS_RELWITHDEBINFO "/SUBSYSTEM:WINDOWS /ENTRY:mainCRTStartup"
+            LINK_FLAGS_RELWITHDEBINFO  "/SUBSYSTEM:WINDOWS /ENTRY:mainCRTStartup"
             LINK_FLAGS_MINSIZEREL "/SUBSYSTEM:WINDOWS /ENTRY:mainCRTStartup"
     )
 
-    # target_sources(BanjoRecompiled PRIVATE ${CMAKE_SOURCE_DIR}/icons/app.rc)
-    target_link_libraries(BanjoRecompiled PRIVATE SDL2)
+    target_sources(BanjoRecompiled PRIVATE ${CMAKE_SOURCE_DIR}/icons/app.rc)
+    target_link_libraries(BanjoRecompiled PRIVATE SDL2 Winmm.lib)
 endif()
 
 if (APPLE)
@@ -310,15 +267,9 @@ if (CMAKE_SYSTEM_NAME MATCHES "Linux")
     find_package(SDL2 REQUIRED)
     find_package(X11 REQUIRED)
 
+    add_compile_definitions("PLUME_SDL_VULKAN_ENABLED")
     add_compile_definitions("RT64_SDL_WINDOW_VULKAN")
 
-    # Generate icon_bytes.c from the app icon PNG.
-    add_custom_command(OUTPUT ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.c ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.h
-        COMMAND file_to_c ${CMAKE_SOURCE_DIR}/icons/512.png icon_bytes ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.c ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.h
-        DEPENDS ${CMAKE_SOURCE_DIR}/icons/512.png
-    )
-    target_sources(BanjoRecompiled PRIVATE ${CMAKE_CURRENT_BINARY_DIR}/icon_bytes.c)
-
     message(STATUS "SDL2_FOUND = ${SDL2_FOUND}")
     message(STATUS "SDL2_INCLUDE_DIRS = ${SDL2_INCLUDE_DIRS}")
 
@@ -348,18 +299,6 @@ if (CMAKE_SYSTEM_NAME MATCHES "Linux")
     target_link_libraries(BanjoRecompiled PRIVATE "-latomic -static-libstdc++" ${CMAKE_DL_LIBS} Threads::Threads)
 endif()
 
-target_link_libraries(BanjoRecompiled PRIVATE
-    PatchesLib
-    RecompiledFuncs
-    librecomp
-    ultramodern
-    rt64
-    RmlUi::Core
-    RmlUi::Debugger
-    nfd
-    lunasvg
-)
-
 # TODO fix the rt64 CMake script so that this doesn't need to be duplicated here
 # For DXC
 set (DXC_COMMON_OPTS "-I${PROJECT_SOURCE_DIR}/src")
@@ -392,8 +331,21 @@ else()
     endif()
 endif()
 
-build_vertex_shader(BanjoRecompiled "shaders/InterfaceVS.hlsl" "shaders/InterfaceVS.hlsl")
-build_pixel_shader(BanjoRecompiled "shaders/InterfacePS.hlsl" "shaders/InterfacePS.hlsl")
+set(RECOMP_FRONTEND_N64MODERNRUNTIME_PATH ${CMAKE_SOURCE_DIR}/lib/N64ModernRuntime)
+set(RECOMP_FRONTEND_RT64_PATH ${CMAKE_SOURCE_DIR}/lib/rt64)
+
+add_subdirectory(${CMAKE_SOURCE_DIR}/lib/RecompFrontend)
+
+target_link_libraries(BanjoRecompiled PRIVATE
+    PatchesLib
+    RecompiledFuncs
+    recompui
+    recompinput
+    librecomp
+    ultramodern
+    rt64
+    nfd
+)
 
 # Embed all .nrm files in the "mods" directory
 file(GLOB NRM_FILES "${CMAKE_SOURCE_DIR}/mods/*.nrm")

assets/Banjo.svg

@@ -0,0 +1,128 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 649 622" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1,0,0,1,-367,-304)">
+        <g transform="matrix(0.946016,0,0,0.946016,29.4118,58.1121)">
+            <g id="Banjo" transform="matrix(19.8117,0,0,19.8117,336.522,82.7412)">
+                <g>
+                    <g>
+                        <path d="M15.411,23.721L16.802,21.264L15.038,16.771C14.44,13.215 16.372,8.93 20.504,9.189C28.893,10.832 37.74,18.394 35.195,32.829C34.692,35.685 31.138,37.414 29.053,36.96" style="fill:rgb(111,36,6);"/>
+                        <path d="M15.038,35.777C15.056,39.159 17.023,42.13 19.725,42.13C26.084,42.13 30.194,36.258 31.12,34.02C32.045,31.782 33.531,27.026 31.12,24.615C29.348,22.843 25.753,21.06 19.991,23.173" style="fill:rgb(255,206,140);"/>
+                        <path d="M28.506,13.481C30.336,11.364 31.158,10.191 33.077,12.435C34.465,14.058 34.168,15.414 31.874,17.788" style="fill:rgb(111,36,6);"/>
+                        <g transform="matrix(0.74875,0,0,0.727217,7.57778,3.95431)">
+                            <path d="M28.941,12.931C30.707,10.695 31.557,9.588 33.539,12.106C34.861,13.784 34.44,15.653 31.992,17.508C31.479,15.668 30.044,14.066 28.941,12.931Z" style="fill:rgb(255,206,140);"/>
+                        </g>
+                        <path d="M16.108,35.523C16.325,39.271 20.035,39.854 22.515,38.056C24.764,36.425 25.913,32.747 24.171,29.342" style="fill:rgb(186,87,87);"/>
+                        <clipPath id="_clip1">
+                            <path d="M16.108,35.523C16.325,39.271 20.035,39.854 22.515,38.056C24.764,36.425 25.913,32.747 24.171,29.342"/>
+                        </clipPath>
+                        <g clip-path="url(#_clip1)">
+                            <path d="M17.337,37.397C19.65,34.474 22.629,33.498 24.081,35.425L23.994,39.036L16.623,39.792L17.337,37.397Z" style="fill:rgb(225,151,151);"/>
+                            <path d="M16.709,35.345C16.811,37.082 17.425,37.886 18.875,38.022C21.324,38.253 24.213,36.316 25.008,33.12C28.305,38.592 25.787,40.96 18.875,40.981C15.876,39.827 14.338,38.095 15.374,35.345" style="fill:white;"/>
+                        </g>
+                        <g>
+                            <path d="M19.427,17.547C18.324,14.059 15.417,15.606 14.776,17.152C14.267,18.381 14.228,20.129 14.776,21.21C15.506,22.65 17.747,24.305 19.427,21.279C19.865,20.49 19.735,18.522 19.427,17.547Z" style="fill:white;"/>
+                            <path d="M23.5,14.989C20.518,14.838 18.529,17.828 19.101,20.275C19.38,21.474 20.275,22.542 21.968,23.047C26.221,24.314 28.194,15.65 23.5,14.989" style="fill:white;"/>
+                            <g transform="matrix(1.05952,0.153499,-0.15249,1.05255,1.44489,-4.37471)">
+                                <clipPath id="_clip2">
+                                    <path d="M22.982,15.046C20.205,15.306 18.767,18.357 19.623,20.557C20.042,21.635 21.012,22.509 22.645,22.75C26.746,23.356 27.41,15.027 22.982,15.046"/>
+                                </clipPath>
+                                <g clip-path="url(#_clip2)">
+                                    <path d="M23.062,17.048C24.572,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.441,22.556 23.062,22.556C21.552,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.755,17.048 23.062,17.048Z" style="fill:rgb(65,175,239);"/>
+                                    <clipPath id="_clip3">
+                                        <path d="M23.062,17.048C24.572,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.441,22.556 23.062,22.556C21.552,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.755,17.048 23.062,17.048Z"/>
+                                    </clipPath>
+                                    <g clip-path="url(#_clip3)">
+                                        <g transform="matrix(1,0,0,1,0.368837,-1.57879)">
+                                            <path d="M23.062,17.048C24.572,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.441,22.556 23.062,22.556C21.552,22.556 21.044,21.376 21.044,19.856C21.044,18.336 21.755,17.048 23.062,17.048Z" style="fill:rgb(7,121,188);"/>
+                                        </g>
+                                        <g transform="matrix(0.53744,1.64783e-17,-1.64783e-17,0.53744,11.0687,9.25602)">
+                                            <clipPath id="_clip4">
+                                                <path d="M22.982,15.046C20.205,15.306 18.767,18.357 19.623,20.557C20.042,21.635 21.012,22.509 22.645,22.75C26.746,23.356 27.41,15.027 22.982,15.046"/>
+                                            </clipPath>
+                                            <g clip-path="url(#_clip4)">
+                                                <path d="M23.062,17.048C24.572,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.441,22.556 23.062,22.556C21.552,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.755,17.048 23.062,17.048Z"/>
+                                            </g>
+                                        </g>
+                                        <g transform="matrix(0.264491,0.0301672,-0.0297719,0.264491,17.1628,13.1906)">
+                                            <clipPath id="_clip5">
+                                                <path d="M22.982,15.046C20.205,15.306 18.767,18.357 19.623,20.557C20.042,21.635 21.012,22.509 22.645,22.75C26.746,23.356 27.41,15.027 22.982,15.046"/>
+                                            </clipPath>
+                                            <g clip-path="url(#_clip5)">
+                                                <path d="M23.062,17.048C24.572,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.441,22.556 23.062,22.556C21.552,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.755,17.048 23.062,17.048Z" style="fill:white;"/>
+                                            </g>
+                                        </g>
+                                    </g>
+                                    <path d="M25.086,19.953C25.086,19.962 25.085,19.97 25.085,19.978C25.067,20.476 24.984,20.868 24.875,21.175C25.011,20.789 25.073,20.363 25.086,19.953ZM24.325,22.071C24.007,22.377 23.588,22.556 23.062,22.556C21.552,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.755,17.048 23.062,17.048C24.498,17.048 25.035,18.164 25.084,19.58C25.07,19.213 25.019,18.875 24.95,18.61C24.561,17.118 23.478,17.07 23.062,17.067L23.062,17.299C23.062,17.306 22.531,17.235 22.045,17.628C21.357,18.183 21.1,19.281 21.19,20.41C21.316,21.985 22.134,22.536 23.157,22.522C23.751,22.515 24.131,22.252 24.325,22.071ZM24.875,21.175C24.87,21.188 24.865,21.202 24.861,21.215C24.773,21.452 24.66,21.665 24.522,21.848C24.638,21.694 24.769,21.476 24.875,21.175Z" style="fill:rgb(7,121,188);"/>
+                                </g>
+                            </g>
+                            <g transform="matrix(0.976398,-0.00871671,0.0091843,1.02877,-5.67531,-0.415767)">
+                                <path d="M23.062,17.048C24.664,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.416,22.556 23.062,22.556C21.461,22.556 21.11,21.416 21.11,19.896C21.11,18.375 21.869,17.048 23.062,17.048Z" style="fill:rgb(65,175,239);"/>
+                                <clipPath id="_clip6">
+                                    <path d="M23.062,17.048C24.664,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.416,22.556 23.062,22.556C21.461,22.556 21.11,21.416 21.11,19.896C21.11,18.375 21.869,17.048 23.062,17.048Z"/>
+                                </clipPath>
+                                <g clip-path="url(#_clip6)">
+                                    <g transform="matrix(1,0,0,1,0.661429,-1.55465)">
+                                        <path d="M23.062,17.048C24.664,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.416,22.556 23.062,22.556C21.461,22.556 20.622,20.935 21.017,19.398C21.396,17.921 21.869,17.048 23.062,17.048Z" style="fill:rgb(7,121,188);"/>
+                                    </g>
+                                    <g transform="matrix(0.53744,-2.16183e-18,-2.27597e-17,0.53744,11.0608,9.33321)">
+                                        <clipPath id="_clip7">
+                                            <path d="M25.328,17.462C23.752,13.788 20.732,15.77 19.87,17.392C17.949,21.006 21.567,25.434 25.638,21.482C25.656,21.464 25.675,21.446 25.694,21.428"/>
+                                        </clipPath>
+                                        <g clip-path="url(#_clip7)">
+                                            <path d="M23.062,17.048C24.664,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.416,22.556 23.062,22.556C21.461,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.869,17.048 23.062,17.048Z"/>
+                                        </g>
+                                    </g>
+                                    <g transform="matrix(0.280835,0.0606888,-0.0622655,0.25954,17.4675,12.6085)">
+                                        <clipPath id="_clip8">
+                                            <path d="M25.328,17.462C23.752,13.788 20.732,15.77 19.87,17.392C17.949,21.006 21.567,25.434 25.638,21.482C25.656,21.464 25.675,21.446 25.694,21.428"/>
+                                        </clipPath>
+                                        <g clip-path="url(#_clip8)">
+                                            <path d="M23.062,17.048C24.664,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.416,22.556 23.062,22.556C21.461,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.869,17.048 23.062,17.048Z" style="fill:white;"/>
+                                        </g>
+                                    </g>
+                                </g>
+                                <path d="M25.052,20.39C25.052,20.391 25.052,20.391 25.052,20.391C25.025,20.607 24.983,20.813 24.925,21.007C25.031,20.648 25.084,20.249 25.088,19.832C25.088,19.855 25.087,19.878 25.087,19.9C25.083,20.058 25.073,20.225 25.052,20.39ZM23.948,22.34C23.695,22.479 23.4,22.556 23.062,22.556C21.461,22.556 21.11,21.416 21.11,19.896C21.11,18.376 21.869,17.048 23.062,17.048L23.062,17.307C22.89,17.304 22.333,17.294 21.83,17.998C21.555,18.383 21.285,19.033 21.255,19.896C21.197,21.55 21.606,22.497 23.078,22.532C23.508,22.542 23.818,22.414 23.99,22.317C23.98,22.323 23.971,22.328 23.961,22.333C23.956,22.336 23.952,22.339 23.948,22.34ZM24.302,22.082C24.251,22.13 24.198,22.174 24.143,22.216C24.216,22.161 24.285,22.101 24.349,22.036C24.333,22.052 24.318,22.067 24.302,22.082ZM24.349,22.036C24.502,21.879 24.672,21.651 24.811,21.325C24.72,21.54 24.607,21.733 24.471,21.9C24.432,21.947 24.392,21.992 24.349,22.036ZM23.062,17.048C24.589,17.048 25.045,18.168 25.085,19.589C25.08,19.443 25.07,19.296 25.054,19.147C24.985,18.494 24.805,17.971 24.482,17.613C24.003,17.084 23.343,17.07 23.062,17.068L23.062,17.048Z" style="fill:rgb(7,121,188);"/>
+                            </g>
+                            <g transform="matrix(0.260875,0.114682,-0.0945952,0.215183,19.9731,15.1626)">
+                                <clipPath id="_clip9">
+                                    <path d="M22.982,15.046C20.205,15.306 18.767,18.357 19.623,20.557C20.042,21.635 21.012,22.509 22.645,22.75C26.746,23.356 27.41,15.027 22.982,15.046"/>
+                                </clipPath>
+                                <g clip-path="url(#_clip9)">
+                                    <path d="M23.062,17.048C24.572,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.441,22.556 23.062,22.556C21.552,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.755,17.048 23.062,17.048Z" style="fill:white;"/>
+                                </g>
+                            </g>
+                            <g transform="matrix(0.27972,0.0291679,-0.0255573,0.245094,12.2906,16.2888)">
+                                <clipPath id="_clip10">
+                                    <path d="M25.328,17.462C23.752,13.788 20.732,15.77 19.87,17.392C17.949,21.006 21.567,25.434 25.638,21.482C25.656,21.464 25.675,21.446 25.694,21.428"/>
+                                </clipPath>
+                                <g clip-path="url(#_clip10)">
+                                    <path d="M23.062,17.048C24.664,17.048 25.088,18.282 25.088,19.802C25.088,21.322 24.416,22.556 23.062,22.556C21.461,22.556 21.037,21.322 21.037,19.802C21.037,18.282 21.869,17.048 23.062,17.048Z" style="fill:white;"/>
+                                </g>
+                            </g>
+                        </g>
+                        <path d="M22.021,9.551C17.546,8.366 12.927,8.618 10.575,14.496C13.332,15.58 16.969,14.792 20.963,12.389" style="fill:rgb(111,36,6);"/>
+                        <g transform="matrix(0.99548,-0.0949726,0.0949726,0.99548,-0.729626,2.03017)">
+                            <path d="M20.504,9.189C16.028,8.005 12.927,8.618 10.575,14.496C13.332,15.58 16.969,14.792 20.963,12.389" style="fill:rgb(111,36,6);"/>
+                        </g>
+                        <g transform="matrix(0.932428,-0.164274,0.175814,0.997929,-0.109592,3.46156)">
+                            <path d="M20.504,9.189C16.028,8.005 12.927,8.618 10.575,14.496C13.332,15.58 16.969,14.792 20.963,12.389" style="fill:rgb(111,36,6);"/>
+                        </g>
+                        <path d="M21.228,22.768C17.758,23.429 15.151,21.035 12.225,20.129C8.051,18.838 3.034,23.309 2.945,24.615C2.399,32.669 6.556,35.739 11.337,36.053C16.118,36.366 23.547,33.798 24.983,26.952" style="fill:rgb(255,206,140);"/>
+                        <clipPath id="_clip11">
+                            <path d="M21.228,22.768C17.758,23.429 15.151,21.035 12.225,20.129C8.051,18.838 3.034,23.309 2.945,24.615C2.399,32.669 6.556,35.739 11.337,36.053C16.118,36.366 23.547,33.798 24.983,26.952"/>
+                        </clipPath>
+                        <g clip-path="url(#_clip11)">
+                            <path d="M14.98,35.788C13.095,36.183 9.808,35.962 7.43,33.8C4.424,31.068 4.608,26.832 4.776,25.035C4.786,24.927 4.861,24.866 4.874,24.856C4.901,24.835 4.932,24.818 4.964,24.808C5.072,24.777 5.155,24.823 5.17,24.831C5.265,24.883 5.291,24.972 5.296,24.988C5.306,25.021 5.305,25.057 5.306,25.092C5.307,25.149 5.082,26.554 5.219,28.18C5.782,34.87 11.575,36.34 14.934,35.795L14.98,35.788Z" style="fill:rgb(180,138,80);"/>
+                        </g>
+                    </g>
+                    <path d="M5.583,25.051C3.978,25 2.552,24.013 1.936,22.53C1.188,20.728 0.716,18.644 1.413,16.951C2.107,15.266 4.098,14.029 6.544,13.982C8.55,13.943 11.204,15.606 11.897,17.253C12.608,18.94 12.621,21.373 10.011,23.906C9.283,24.611 8.32,25.02 7.307,25.056C6.781,25.074 6.209,25.071 5.583,25.051Z" style="fill:rgb(49,49,49);"/>
+                    <path d="M5.291,19.898C5.039,19.32 4.979,18.579 5.104,18.052C5.24,17.478 8.438,17.548 8.072,18.561C7.976,18.828 7.077,19.806 7.077,19.806C7.785,18.616 7.609,18.466 7.395,18.461C6.487,18.437 5.784,18.913 5.291,19.898Z"/>
+                    <g transform="matrix(-0.540336,-0.220184,-0.310328,0.761552,11.9366,5.53434)">
+                        <path d="M5.291,19.898C5.039,19.32 4.979,18.579 5.104,18.052C5.24,17.478 8.438,17.548 8.072,18.561C7.976,18.828 7.077,19.806 7.077,19.806C7.785,18.616 7.609,18.466 7.395,18.461C6.487,18.437 5.784,18.913 5.291,19.898Z"/>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

assets/Cloud1.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 461 154" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1,0,0,1,-104,-128)">
+        <path id="Cloud1" d="M541.776,256.714C556.651,258.998 565,261.564 565,264.275C565,273.809 461.716,281.55 334.5,281.55C207.284,281.55 104,273.809 104,264.275C104,260.866 117.201,257.687 139.978,255.009C136.85,250.725 135,245.429 135,239.7C135,225.461 146.426,213.9 160.5,213.9C166.004,213.9 171.103,215.668 175.272,218.673C177.641,197.762 195.214,181.5 216.512,181.5C231.842,181.5 245.242,189.926 252.431,202.446C257.117,190.196 268.878,181.5 282.631,181.5C290.836,181.5 298.332,184.596 304.04,189.694C304.013,188.966 304,188.235 304,187.5C304,154.661 330.661,128 363.5,128C380.444,128 395.742,135.098 406.583,146.479C410.731,137.908 419.439,132 429.5,132C441.276,132 451.198,140.093 454.124,151.077C457.505,150.371 461.007,150 464.593,150C492.936,150 515.972,173.174 516.185,201.801C516.786,201.767 517.391,201.75 518,201.75C535.865,201.75 550.369,216.425 550.369,234.5C550.369,243.07 547.109,250.875 541.776,256.714Z" style="fill:white;"/>
+    </g>
+</svg>

assets/Cloud2.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 461 167" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1,0,0,1,-659,-115)">
+        <g id="Cloud2" transform="matrix(1,0,0,1,555,0)">
+            <path d="M542.735,256.863C557.009,259.11 565,261.623 565,264.275C565,273.809 461.716,281.55 334.5,281.55C207.284,281.55 104,273.809 104,264.275C104,261.041 115.882,258.014 136.55,255.424C133.075,251.144 130.988,245.666 130.988,239.7C130.988,226.013 141.972,214.9 155.5,214.9C160.086,214.9 164.379,216.177 168.051,218.398C168.017,217.769 168,217.137 168,216.5C168,197.459 183.279,182 202.099,182C209.626,182 216.587,184.473 222.23,188.659C226.718,160.251 251.339,138.5 281,138.5C288.882,138.5 296.409,140.036 303.296,142.825C317.767,126.151 339.111,115.6 362.9,115.6C391.852,115.6 417.183,131.228 430.91,154.501C435.157,152.885 439.757,152 444.56,152C465.981,152 483.372,169.596 483.372,191.269C483.372,192.715 483.295,194.143 483.144,195.548C487.017,193.597 491.383,192.5 496,192.5C511.956,192.5 524.91,205.606 524.91,221.75C524.91,223.717 524.718,225.638 524.351,227.496C526.498,226.534 528.873,226 531.371,226C540.958,226 548.741,233.875 548.741,243.575C548.741,248.88 546.413,253.64 542.735,256.863Z" style="fill:white;"/>
+        </g>
+    </g>
+</svg>

assets/Cloud3.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 295 167" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1,0,0,1,-1190,-115)">
+        <g id="Cloud3" transform="matrix(1,0,0,1,991.5,2.84217e-14)">
+            <path d="M211.793,257.103C203.71,250.792 198.5,240.894 198.5,229.775C198.5,210.734 213.779,195.275 232.599,195.275L232.611,195.275C234.309,170.098 255.297,150.174 280.901,150.174C287.974,150.174 294.694,151.694 300.753,154.426C311.82,131.462 335.322,115.6 362.5,115.6C391.518,115.6 416.345,133.682 426.32,159.183C430.023,156.91 434.367,155.6 439.012,155.6C452.54,155.6 463.523,166.713 463.523,180.4C463.523,182.645 463.228,184.821 462.674,186.89C479.579,191.132 492.124,206.599 492.124,225.006C492.124,237.763 486.099,249.107 476.773,256.282C487.456,258.673 493.5,261.392 493.5,264.275C493.5,273.809 427.407,281.55 346,281.55C264.593,281.55 198.5,273.809 198.5,264.275C198.5,261.717 203.258,259.288 211.793,257.103Z" style="fill:white;"/>
+        </g>
+    </g>
+</svg>

assets/Cloud4.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 301 293" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1,0,0,1,-446,-345)">
+        <path id="Cloud4" d="M507.232,547.816C501.885,550.184 495.97,551.5 489.75,551.5C465.88,551.5 446.5,532.12 446.5,508.25C446.5,484.38 465.88,465 489.75,465C496.442,465 502.78,466.523 508.438,469.241C508.211,467.861 508.092,466.444 508.092,465C508.092,456.045 512.646,448.144 519.562,443.49C516.331,439.168 514.417,433.806 514.417,428C514.417,413.701 526.026,402.092 540.325,402.092C544.387,402.092 548.232,403.029 551.656,404.698C558.101,398.629 566.782,394.908 576.325,394.908C578.586,394.908 580.798,395.117 582.943,395.516C582.325,392.678 582,389.731 582,386.709C582,363.919 600.502,345.417 623.291,345.417C645.367,345.417 663.42,362.779 664.529,384.581C666.116,384.142 667.782,383.908 669.5,383.908C680.262,383.908 689,393.094 689,404.408L688.998,404.729C692.46,401.423 697.058,399.408 702.099,399.408C708.585,399.408 714.336,402.744 717.882,407.873C719.085,407.628 720.328,407.5 721.599,407.5C732.361,407.5 741.099,416.686 741.099,428C741.099,432.836 739.502,437.284 736.833,440.791C739.534,445.046 741.099,450.092 741.099,455.5C741.099,470.678 728.777,483 713.599,483C707.252,483 701.405,480.845 696.749,477.228C695.363,487.436 688.367,495.872 678.972,499.323C678.991,499.879 679,500.439 679,501C679,507.623 677.683,513.941 675.297,519.706C676.122,521.635 676.733,523.677 677.1,525.803C685.992,530.361 692.083,539.62 692.083,550.291C692.083,550.59 692.078,550.888 692.069,551.184C695.81,551.993 699.161,553.931 701.787,556.643C706.24,553.716 711.501,552.024 717.135,552.024C733.148,552.024 746.147,565.691 746.147,582.524C746.147,589.606 743.847,596.127 739.989,601.306C741.31,604.095 742.049,607.212 742.049,610.5C742.049,622.38 732.404,632.024 720.524,632.024C715.35,632.024 710.599,630.194 706.885,627.147C701.859,633.741 693.923,638 685,638C669.822,638 657.5,625.678 657.5,610.5C657.5,607.508 657.979,604.626 658.864,601.929C649.258,601.088 641.62,592.914 641.036,582.753C640.047,582.915 639.033,583 638,583C631.267,583 625.326,579.405 621.822,573.942C618.019,576.272 613.811,578.004 609.33,579.006C606.616,586.84 599.485,592.451 591.111,592.5C591.691,594.787 592,597.182 592,599.648C592,615.654 579.006,628.648 563,628.648C555.88,628.648 549.356,626.077 544.307,621.813C541.916,622.913 539.275,623.524 536.5,623.524C525.738,623.524 517,614.339 517,603.024C517,597.125 519.376,591.804 523.175,588.063C519.493,585.907 517,581.774 517,577.033C517,574.591 517.661,572.31 518.806,570.377C511.821,567.258 506.917,559.976 506.917,551.5C506.917,550.242 507.025,549.011 507.232,547.816Z" style="fill:white;"/>
+    </g>
+</svg>

assets/JiggyColor.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 1054 1044" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1,0,0,1,-348,-18)">
+        <g transform="matrix(0.965901,0,0,0.965901,29.8367,18.4135)">
+            <rect x="330" y="0" width="1090" height="1080" style="fill:rgb(255,201,69);"/>
+        </g>
+    </g>
+</svg>

assets/JiggyHole.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 2180 2160" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(0.837799,0,0,0.823158,362.599,628.361)">
+        <path d="M2169.26,-763.354L2169.26,1860.69L-432.8,1860.69L-432.8,-763.354L2169.26,-763.354ZM576.269,847.984L660.512,1167.98L950.699,1088.84C912.269,1067.12 882.2,1030.18 869.936,983.6C845.93,892.416 899.177,798.549 988.767,774.117C1078.36,749.684 1170.58,803.878 1194.59,895.062C1206.85,941.647 1198.96,988.933 1176.35,1027.3L1466.53,948.162L1382.27,628.092C1360.47,662.883 1326.33,689.805 1284.12,701.316C1194.53,725.75 1102.3,671.558 1078.3,580.372C1054.29,489.188 1107.54,395.321 1197.13,370.888C1239.34,359.377 1282.13,365.317 1318.1,384.358L1250.56,127.805L960.463,206.919C983.019,168.569 990.892,121.33 978.639,74.789C954.634,-16.395 862.407,-70.589 772.817,-46.157C683.227,-21.724 629.98,72.143 653.985,163.327C666.238,209.868 696.263,246.771 734.637,268.505L444.539,347.619L512.06,604.091C476.111,585.098 433.361,579.18 391.193,590.679C301.6,615.113 248.356,708.979 272.362,800.163C296.368,891.349 388.591,945.541 478.184,921.108C520.352,909.608 554.468,882.73 576.269,847.984Z" style="fill:#1F63C2"/>
+    </g>
+</svg>

assets/JiggyShine.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 1275 1346" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(1,0,0,1,-505,-288)">
+        <g transform="matrix(1,0,0,1,182,432)">
+            <g transform="matrix(1.60405,0.926099,-0.849835,1.47196,-1141.53,-1729.71)">
+                <path d="M1708.78,2.179L1708.78,916.607L1476.3,1062.88L1476.3,148.447L1708.78,2.179Z" style="fill:white;"/>
+            </g>
+        </g>
+    </g>
+</svg>

assets/Kazooie.svg

@@ -0,0 +1,98 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 626 774" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(18.7432,0,0,18.7432,-523.058,-16.6354)">
+        <path d="M27.907,26.263C28.143,24.255 29.853,23.644 30.51,21.766C31.989,17.547 33.536,12.065 38.499,11.647C42.804,11.285 46.114,18.297 46.269,20.704" style="fill:rgb(255,8,0);"/>
+        <path d="M43.914,24.141L49.374,21.553L61.231,20.771C56.596,22.793 54.56,24.744 52.176,26.175C50.874,26.957 47.438,26.469 46.145,25.919" style="fill:rgb(147,73,55);"/>
+        <path d="M33.358,24.754L37.467,23.743L47.922,25.487C47.383,28.654 46.443,34.187 46.585,37.22C46.768,41.132 46.802,42.424 46.139,42.146C42.525,40.635 38.206,35.972 35.282,32.266" style="fill:rgb(255,247,82);"/>
+        <clipPath id="_clip1">
+            <path d="M33.358,24.754L37.467,23.743L47.922,25.487C47.383,28.654 46.443,34.187 46.585,37.22C46.768,41.132 46.802,42.424 46.139,42.146C42.525,40.635 38.206,35.972 35.282,32.266"/>
+        </clipPath>
+        <g clip-path="url(#_clip1)">
+            <path d="M43.6,21.343L43.875,30.283C46.057,30.917 47.599,29.129 49.287,27.789L50.722,20.771L43.6,21.343Z" style="fill:rgb(255,152,82);"/>
+        </g>
+        <path d="M37.467,26.47C35.161,26.605 40.2,34.968 43.039,38.061" style="fill:rgb(255,152,82);"/>
+        <path d="M37.467,26.47C39.247,33.527 42.035,37.894 45.617,40.282C45.691,34.495 45.504,29.033 46.702,26.47L37.467,26.47Z" style="fill:rgb(255,107,140);"/>
+        <g transform="matrix(1,0,0,1,0.34705,-0.563957)">
+            <g transform="matrix(1.0402,0,0,1.03343,2.01974,-0.750564)">
+                <path d="M38.377,15.224C40.611,15.039 41.442,17.13 41.442,19.136C41.442,21.141 40.627,21.872 38.76,21.872C37.848,21.872 36.545,20.671 36.545,18.665C36.545,16.66 37.384,15.306 38.377,15.224Z" style="fill:white;"/>
+            </g>
+            <g transform="matrix(1.0402,0,0,1.03343,-1.44414,-0.706384)">
+                <path d="M38.038,15.181C39.905,15.181 41.442,17.13 41.442,19.136C41.442,21.141 40.244,22.547 38.377,22.547C36.51,22.547 34.728,21.521 34.655,18.815C34.6,16.81 35.767,15.181 38.038,15.181Z" style="fill:white;"/>
+            </g>
+            <g transform="matrix(0.763712,0,0,0.933729,13.3761,0.911446)">
+                <path d="M38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,20.987 39.27,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388Z" style="fill:rgb(20,219,51);"/>
+                <clipPath id="_clip2">
+                    <path d="M38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,20.987 39.27,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388Z"/>
+                </clipPath>
+                <g clip-path="url(#_clip2)">
+                    <g transform="matrix(1.07989,0,0,0.943665,-2.82912,-0.546845)">
+                        <path d="M38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,20.987 39.27,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388Z" style="fill:rgb(12,133,22);"/>
+                    </g>
+                </g>
+            </g>
+            <g transform="matrix(0.763712,0,0,0.933729,13.3761,0.911446)">
+                <path d="M39.038,21.804C38.795,21.947 38.525,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,19.793 40.102,19.878 40.095,19.961C40.075,20.177 40.032,20.391 39.964,20.595C39.929,20.699 39.889,20.799 39.842,20.895C40.203,20.141 40.208,19.154 39.751,18.365C39.566,18.046 39.333,17.813 39.097,17.661C38.696,17.403 38.343,17.409 38.24,17.41L38.386,17.673C37.862,17.663 36.964,17.751 36.767,19.414C36.741,19.629 36.582,20.489 37.094,21.246C37.656,22.075 38.427,22.165 39.048,21.798C39.045,21.8 39.041,21.802 39.038,21.804ZM39.515,21.4C39.388,21.547 39.245,21.673 39.089,21.773C39.075,21.781 39.062,21.79 39.048,21.798C39.227,21.688 39.382,21.553 39.515,21.4Z" style="fill:rgb(12,133,22);"/>
+            </g>
+            <g transform="matrix(0.399715,0,0,0.412466,27.3537,11.0962)">
+                <path d="M38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,20.987 39.27,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388Z"/>
+            </g>
+            <g transform="matrix(0.240395,0.0616877,-0.0641565,0.250016,34.2748,11.2529)">
+                <path d="M38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,20.987 39.27,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388Z" style="fill:white;"/>
+            </g>
+            <g transform="matrix(0.944849,0,0,0.933729,1.79968,1.16243)">
+                <ellipse cx="38.239" cy="19.707" rx="1.867" ry="2.319" style="fill:rgb(20,219,51);"/>
+                <clipPath id="_clip3">
+                    <ellipse cx="38.239" cy="19.707" rx="1.867" ry="2.319"/>
+                </clipPath>
+                <g clip-path="url(#_clip3)">
+                    <g transform="matrix(0.942334,0,0,1,2.31274,-1.38757)">
+                        <ellipse cx="38.239" cy="19.707" rx="1.867" ry="2.319" style="fill:rgb(12,133,22);"/>
+                    </g>
+                </g>
+            </g>
+            <g transform="matrix(0.944849,0,0,0.933729,1.79968,1.16243)">
+                <path d="M39.028,21.81C39.021,21.814 39.013,21.818 39.004,21.823C39.071,21.785 39.12,21.752 39.148,21.733C39.109,21.761 39.069,21.786 39.028,21.81ZM38.239,17.388C38.343,17.388 38.444,17.398 38.543,17.418C38.568,17.424 38.594,17.43 38.62,17.437C38.503,17.407 38.376,17.389 38.239,17.388ZM39.004,21.823C38.771,21.954 38.512,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 37.209,17.388 38.239,17.388L38.24,17.673C37.454,17.643 37.06,18.287 36.829,18.962C36.365,20.317 36.923,21.898 38.18,21.998C38.598,22.031 38.906,21.878 39.004,21.823ZM38.62,17.437C38.652,17.445 38.683,17.454 38.714,17.464C38.872,17.515 39.021,17.592 39.16,17.69C38.966,17.553 38.776,17.478 38.62,17.437ZM39.376,17.868C39.47,17.958 39.557,18.058 39.636,18.169C39.687,18.24 39.735,18.316 39.778,18.395C39.71,18.272 39.579,18.063 39.376,17.868ZM40.091,19.409C40.101,19.507 40.106,19.606 40.106,19.707C40.106,19.733 40.106,19.759 40.105,19.785C40.1,19.962 40.078,20.138 40.041,20.309C40.104,20.017 40.121,19.711 40.091,19.409ZM40.041,20.309C39.998,20.508 39.934,20.702 39.849,20.882C39.822,20.939 39.793,20.995 39.762,21.048C39.89,20.823 39.984,20.572 40.041,20.309Z" style="fill:rgb(12,133,22);"/>
+            </g>
+            <g transform="matrix(0.455702,0,0,0.450339,20.5043,10.6887)">
+                <ellipse cx="38.239" cy="19.707" rx="1.867" ry="2.319"/>
+            </g>
+            <g transform="matrix(0.240395,0.0616877,-0.0714623,0.278486,29.3898,11.0009)">
+                <path d="M38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,20.987 39.27,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388Z" style="fill:white;"/>
+            </g>
+            <g transform="matrix(0.240395,0.0616877,-0.0641565,0.250016,35.9349,12.8745)">
+                <path d="M38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,20.987 39.27,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388Z" style="fill:white;"/>
+            </g>
+            <g transform="matrix(0.240395,0.0616877,-0.0714623,0.278486,31.4342,12.886)">
+                <path d="M38.239,17.388C39.269,17.373 40.106,18.427 40.106,19.707C40.106,20.987 39.27,22.027 38.239,22.027C37.209,22.027 36.373,20.987 36.373,19.707C36.373,18.427 36.826,17.407 38.239,17.388Z" style="fill:white;"/>
+            </g>
+        </g>
+        <path d="M34.949,26.47C45.991,30.923 49.398,22.609 61.231,20.771C56.331,18.491 47.094,19.43 40.335,20.771C34.477,21.934 29.498,23.59 28.13,25.595C26.823,27.513 31.911,30.95 36.88,32.959" style="fill:rgb(255,247,82);"/>
+        <clipPath id="_clip4">
+            <path d="M34.949,26.47C45.991,30.923 49.398,22.609 61.231,20.771C56.331,18.491 47.094,19.43 40.335,20.771C34.477,21.934 29.498,23.59 28.13,25.595C26.823,27.513 31.911,30.95 36.88,32.959"/>
+        </clipPath>
+        <g clip-path="url(#_clip4)">
+            <path d="M62.518,20.767L57.185,19.666C55.674,19.774 54.3,23.016 56.708,23.584" style="fill:rgb(247,132,16);"/>
+        </g>
+        <g>
+            <g transform="matrix(0.970003,-0.154382,0.15857,1.02858,0.0314522,6.52731)">
+                <path d="M36.982,11.628C36.695,7.2 36.995,2.859 40.066,0.878C40.807,0.628 41.65,0.686 42.38,0.969C39.087,3.153 39.139,8.22 39.064,11.626L38.091,11.715L37.004,11.962C37.001,11.913 36.997,11.864 36.994,11.814L36.97,11.817C36.973,11.754 36.977,11.691 36.982,11.628Z" style="fill:url(#_Radial5);"/>
+            </g>
+            <g transform="matrix(0.978973,0.0797037,-0.0925252,1.07184,2.61052,-2.90073)">
+                <path d="M36.982,11.628C36.695,7.2 36.995,2.859 40.066,0.878C40.915,0.615 41.659,0.75 42.38,0.969C39.087,3.153 39.139,8.22 39.064,11.626L38.091,11.715L37.004,11.962C37.001,11.913 36.997,11.864 36.994,11.814L36.97,11.817C36.973,11.754 36.977,11.691 36.982,11.628Z" style="fill:url(#_Radial6);"/>
+            </g>
+            <g transform="matrix(0.932256,0.309256,-0.344847,1.02284,7.32634,-11.0721)">
+                <path d="M36.982,11.628C36.695,7.2 36.995,2.859 40.066,0.878C40.558,0.663 41.699,0.839 42.424,1.166C39.132,3.351 39.139,8.22 39.064,11.626L38.091,11.715L37.004,11.962C37.001,11.913 36.997,11.864 36.994,11.814L36.97,11.817C36.973,11.754 36.977,11.691 36.982,11.628Z" style="fill:url(#_Radial7);"/>
+            </g>
+            <g transform="matrix(0.83251,0.521217,-0.556563,0.879409,13.5819,-17.463)">
+                <path d="M36.982,11.628C36.695,7.2 36.741,3.068 39.813,1.087C40.656,1.113 41.659,1.428 42.132,1.96C38.866,3.835 38.481,9.299 39.456,10.905L38.091,11.715L37.004,11.962C37.001,11.913 36.997,11.864 36.994,11.814L36.97,11.817C36.973,11.754 36.977,11.691 36.982,11.628Z" style="fill:url(#_Radial8);"/>
+            </g>
+        </g>
+    </g>
+    <defs>
+        <radialGradient id="_Radial5" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(4.36904,-9.3704,9.9501,4.16909,36.9827,11.4974)"><stop offset="0" style="stop-color:rgb(255,8,0);stop-opacity:1"/><stop offset="0.52" style="stop-color:rgb(249,29,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(231,99,0);stop-opacity:1"/></radialGradient>
+        <radialGradient id="_Radial6" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(4.36904,-9.3704,9.9501,4.16909,36.9827,11.4974)"><stop offset="0" style="stop-color:rgb(255,8,0);stop-opacity:1"/><stop offset="0.52" style="stop-color:rgb(249,29,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(231,99,0);stop-opacity:1"/></radialGradient>
+        <radialGradient id="_Radial7" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(4.36904,-9.3704,9.9501,4.16909,36.9827,11.4974)"><stop offset="0" style="stop-color:rgb(255,8,0);stop-opacity:1"/><stop offset="0.52" style="stop-color:rgb(249,29,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(231,99,0);stop-opacity:1"/></radialGradient>
+        <radialGradient id="_Radial8" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(4.36904,-9.3704,9.9501,4.16909,36.9827,11.4974)"><stop offset="0" style="stop-color:rgb(255,8,0);stop-opacity:1"/><stop offset="0.52" style="stop-color:rgb(249,29,0);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(231,99,0);stop-opacity:1"/></radialGradient>
+    </defs>
+</svg>

assets/config_menu.rml

@@ -1,136 +0,0 @@
-<rml>
-<head>
-	<link type="text/rcss" href="rml.rcss"/>
-	<link type="text/rcss" href="recomp.rcss"/>
-	<title>Inventory</title>
-	<style>
-		body
-		{
-			width: 100%;
-			height: 100%;
-		}
-
-		/* Hide the window icon. */
-		div#title_bar div#icon
-		{
-			display: none;
-		}
-		.flex-grid {
-			display: flex;
-		}
-		.col {
-			flex: 1;
-			text-align: center;
-		}
-	</style>
-	<link type="text/template" href="config_menu/general.rml" />
-	<link type="text/template" href="config_menu/controls.rml" />
-	<link type="text/template" href="config_menu/graphics.rml" />
-	<link type="text/template" href="config_menu/sound.rml" />
-	<link type="text/template" href="config_menu/mods.rml" />
-	<link type="text/template" href="config_menu/debug.rml" />
-</head>
-<body class="window">
-	<!-- <handle move_target="#document"> -->
-		<div id="window" class="rmlui-window" style="display:flex; flex-flow: column; background-color:rgba(0,0,0,0)" onkeydown="config_keydown">
-			<div class="centered-page" onclick="close_config_menu_backdrop">
-				<div class="centered-page__modal">
-					<tabset class="tabs" id="config_tabset">
-						<tab class="tab" autofocus id="tab_general">
-							<div>General</div>
-							<div class="tab__indicator"></div>
-						</tab>
-						<panel class="config" data-model="general_model">
-							<template src="config-menu__general" />
-						</panel>
-						<tab class="tab" id="tab_controls">
-							<div>Controls</div>
-							<div class="tab__indicator"></div>
-						</tab>
-						<panel class="config" data-model="controls_model">
-							<template src="config-menu__controls" />
-						</panel>
-						<tab class="tab" id="tab_graphics">
-							<div>Graphics</div>
-							<div class="tab__indicator"></div>
-						</tab>
-						<panel class="config" data-model="graphics_model">
-							<template src="config-menu__graphics" />
-						</panel>
-						<tab class="tab" id="tab_sound">
-							<div>Sound</div>
-							<div class="tab__indicator"></div>
-						</tab>
-						<panel class="config" data-model="sound_options_model">
-							<template src="config-menu__sound" />
-						</panel>
-						<tab class="tab" id="tab_mods">
-							<div>Mods</div>
-							<div class="tab__indicator"></div>
-						</tab>
-						<panel class="config">
-							<template src="config-menu__mods" />
-						</panel>
-						<tab class="tab" data-model="debug_model" data-if="debug_enabled" id="tab_debug">
-							<div>Debug</div>
-							<div class="tab__indicator"></div>
-						</tab>
-						<panel class="config" data-model="debug_model">
-							<template src="config-menu__debug" />
-						</panel>
-					</tabset>
-					<div class="config__icon-buttons">
-						<button
-							class="icon-button"
-							onclick="open_quit_game_prompt"
-							id="config__quit-game-button"
-						>
-							<svg src="icons/Quit.svg" />
-						</button>
-						<button
-							class="icon-button"
-							onclick="close_config_menu"
-							id="config__close-menu-button"
-						>
-							<svg src="icons/X.svg" />
-						</button>
-					</div>
-				</div>
-				<div
-					class="centered-page__controls"
-					data-model="nav_help_model"
-				>
-					<label>
-						<span>Navigate</span>
-						<span class="prompt-font-sm">{{nav_help__navigate}}</span>
-					</label>
-					<label>
-						<span>Accept</span>
-						<span class="prompt-font-sm">{{nav_help__accept}}</span>
-					</label>
-					<label>
-						<span>Exit</span>
-						<span class="prompt-font-sm">{{nav_help__exit}}</span>
-					</label>
-					<!-- <label><span style="font-family:promptfont;">&#x21F3;</span> Navigate</label>
-					<label><span style="font-family:promptfont;">&#x21A7;</span> Accept</label> -->
-				</div>
-			</div>
-			<!-- <div
-				id="prompt-root"
-				data-model="prompt_model"
-				data-if="prompt__open"
-				data-alias-promptOpen="prompt__open"
-				data-alias-promptHeader="prompt__header"
-				data-alias-promptContent="prompt__content"
-				data-alias-promptConfirmLabel="prompt__confirmLabel"
-				data-alias-promptCancelLabel="prompt__cancelLabel"
-				data-event-click="prompt__on_click"
-			>
-				<template src="prompt"/>
-			</div> -->
-		</div>
-	<!-- </handle> -->
-	<!-- <handle size_target="#document" style="position: absolute; width: 16dp; height: 16dp; bottom: 0px; right: 0px; cursor: resize;"></handle> -->
-</body>
-</rml>

assets/config_menu/controls.rml

@@ -1,360 +0,0 @@
-<template name="config-menu__controls">
-    <head>
-    </head>
-    <body>
-        <form class="config__form" data-attr-cur-input="cur_input_row" data-attr-cur-binding-slot="active_binding_slot">
-            <div class="config__header">
-                <div class="config__header-left">
-                    <button
-                        class="toggle"
-                        id="cont_kb_toggle"
-                        data-class-toggle--checked="input_device_is_keyboard"
-                        onclick="toggle_input_device"
-                        style="nav-down: #input_row_button_0_0; nav-up: #tab_controls"
-                    >
-                        <div class="toggle__border" />
-                        <div class="toggle__floater" />
-                        <div class="toggle__icons">
-                            <div class="toggle__icon toggle__icon--left"><div>␼</div></div>
-                            <div class="toggle__icon toggle__icon--right"><div>␽</div></div>
-                        </div>
-                    </button>
-                </div>
-                <div>
-                    <button
-                        class="button button--warning"
-                        style="nav-down:#input_row_button_0_0"
-                        data-event-click="reset_input_bindings_to_defaults"
-                    >
-                        <div class="button__label">Reset to defaults</div>
-                    </button>
-                </div>
-            </div>
-            <div class="config__wrapper input-config">
-                <div class="input-config__horizontal-split">
-                    <div class="input-config__mappings" data-event-mouseout="set_input_row_focus(-1)">
-                        <div class="input-config__mappings-scroll">
-                            <div class="input-config__mappings-wrapper">
-                                <div
-                                    class="control-option"
-                                    data-attr-id="'input_row_' + i"
-                                    data-for="input_bindings, i : inputs.array"
-                                    data-event-mouseover="set_input_row_focus(i)"
-                                    data-class-control-option--active="get_input_enum_name(i)==cur_input_row"
-                                    data-if="!input_device_is_keyboard || (get_input_enum_name(i) != 'TOGGLE_MENU' && get_input_enum_name(i) != 'ACCEPT_MENU' && get_input_enum_name(i) != 'APPLY_MENU')"
-                                >
-                                    <label
-                                        class="control-option__label"
-                                    >{{get_input_name(i)}}</label>
-                                    <div class="control-option__bindings">
-                                        <button
-                                            data-attr-id="'input_row_button_' + i + '_' + j"
-                                            data-event-blur="set_input_row_focus(-1)"
-                                            data-event-focus="set_input_row_focus(i)"
-                                            data-for="cur_binding, j : input_bindings"
-                                            data-event-click="set_input_binding(i,j)"
-                                            class="prompt-font control-option__binding"
-                                            data-attr-bind-slot="j"
-                                            data-attr-style="i == 0 ? 'nav-up:#cont_kb_toggle' : 'nav-up:auto'"
-                                        >
-                                            <div class="control-option__binding-recording">
-                                                <div class="control-option__binding-circle" />
-                                                <div class="control-option__binding-edge">
-                                                    <svg class="control-option__binding-edge-svg" src="icons/RecordBorder.svg" />
-                                                </div>
-                                            </div>
-                                            <div class="control-option__binding-icon">{{cur_binding}}</div>
-                                        </button>
-                                    </div>
-                                    <button
-                                        data-if="get_input_enum_name(i) != 'TOGGLE_MENU' && get_input_enum_name(i) != 'ACCEPT_MENU'"
-                                        data-event-blur="set_input_row_focus(-1)"
-                                        data-event-focus="set_input_row_focus(i)"
-                                        data-event-click="clear_input_bindings(i)"
-                                        class="icon-button icon-button--danger"
-                                        data-attr-style="i == 0 ? 'nav-up:#cont_kb_toggle' : 'nav-up:auto'"
-                                    >
-                                        <svg src="icons/Trash.svg" />
-                                    </button>
-                                    <button
-                                        data-if="get_input_enum_name(i) == 'TOGGLE_MENU' || get_input_enum_name(i) == 'ACCEPT_MENU'"
-                                        data-event-blur="set_input_row_focus(-1)"
-                                        data-event-focus="set_input_row_focus(i)"
-                                        data-event-click="reset_single_input_binding_to_default(i)"
-                                        class="icon-button icon-button--danger"
-                                        data-attr-style="i == 0 ? 'nav-up:#cont_kb_toggle' : 'nav-up:auto'"
-                                    >
-                                        <svg src="icons/Reset.svg" />
-                                    </button>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div class="input-config__visual-wrapper">
-                        <div class="input-config__visual-aspect">
-                            <div class="input-config__visual">
-                                <!-- stick only -->
-                                <div class="input-config__visual-stick-wrapper">
-                                    <div
-                                        class="input-viz input-config__visual-stick"
-                                        visual-input="X_AXIS_NEG X_AXIS_POS Y_AXIS_NEG Y_AXIS_POS"
-                                    >
-                                        <div class="input-viz__stick-split input-viz__stick-split--vertical">
-                                            <div class="input-viz input-viz__mappings" visual-input="Y_AXIS_POS">
-                                                <svg class="input-viz__dpad-arrow input-viz__dpad-arrow--up" src="icons/VizMap/DPadArrow.svg" />
-                                                <div
-                                                    class="input-config__visual-mapping"
-                                                    data-for="cur_binding, i : inputs.Y_AXIS_POS"
-                                                >
-                                                    <div>{{cur_binding}}</div>
-                                                </div>
-                                            </div>
-                                            <div class="input-viz__dpad-divider" />
-                                            <div class="input-viz input-viz__mappings" visual-input="Y_AXIS_NEG">
-                                                <svg class="input-viz__dpad-arrow input-viz__dpad-arrow--down" src="icons/VizMap/DPadArrow.svg" />
-                                                <div
-                                                    class="input-config__visual-mapping"
-                                                    data-for="cur_binding, i : inputs.Y_AXIS_NEG"
-                                                >
-                                                    <div>{{cur_binding}}</div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="input-viz__stick-split input-viz__stick-split--horizontal">
-                                            <div class="input-viz input-viz__mappings" visual-input="X_AXIS_NEG">
-                                                <svg class="input-viz__dpad-arrow input-viz__dpad-arrow--left" src="icons/VizMap/DPadArrow.svg" />
-                                                <div
-                                                    class="input-config__visual-mapping"
-                                                    data-for="cur_binding, i : inputs.X_AXIS_NEG"
-                                                >
-                                                    <div>{{cur_binding}}</div>
-                                                </div>
-                                            </div>
-                                            <div class="input-viz__dpad-divider" />
-                                            <div class="input-viz input-viz__mappings" visual-input="X_AXIS_POS">
-                                                <svg class="input-viz__dpad-arrow input-viz__dpad-arrow--right" src="icons/VizMap/DPadArrow.svg" />
-                                                <div
-                                                    class="input-config__visual-mapping"
-                                                    data-for="cur_binding, i : inputs.X_AXIS_POS"
-                                                >
-                                                    <div>{{cur_binding}}</div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- top half -->
-                                <div class="input-config__visual-half">
-                                    <div class="input-config__visual-quarter-left">
-                                        <div
-                                            class="input-viz input-viz__dpad"
-                                            visual-input="DPAD_UP DPAD_DOWN DPAD_LEFT DPAD_RIGHT"
-                                        >
-                                            <svg src="icons/VizMap/DPad.svg" />
-                                            <div class="input-viz__dpad-split input-viz__dpad-split--vertical">
-                                                <div class="input-viz input-viz__mappings" visual-input="DPAD_UP">
-                                                    <svg class="input-viz__dpad-arrow input-viz__dpad-arrow--up" src="icons/VizMap/DPadArrow.svg" />
-                                                    <div
-                                                        class="input-config__visual-mapping"
-                                                        data-for="cur_binding, i : inputs.DPAD_UP"
-                                                    >
-                                                        <div>{{cur_binding}}</div>
-                                                    </div>
-                                                </div>
-                                                <div class="input-viz__dpad-divider" />
-                                                <div class="input-viz input-viz__mappings" visual-input="DPAD_DOWN">
-                                                    <svg class="input-viz__dpad-arrow input-viz__dpad-arrow--down" src="icons/VizMap/DPadArrow.svg" />
-                                                    <div
-                                                        class="input-config__visual-mapping"
-                                                        data-for="cur_binding, i : inputs.DPAD_DOWN"
-                                                    >
-                                                        <div>{{cur_binding}}</div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div class="input-viz__dpad-split input-viz__dpad-split--horizontal">
-                                                <div class="input-viz input-viz__mappings" visual-input="DPAD_LEFT">
-                                                    <svg class="input-viz__dpad-arrow input-viz__dpad-arrow--left" src="icons/VizMap/DPadArrow.svg" />
-                                                    <div
-                                                        class="input-config__visual-mapping"
-                                                        data-for="cur_binding, i : inputs.DPAD_LEFT"
-                                                    >
-                                                        <div>{{cur_binding}}</div>
-                                                    </div>
-                                                </div>
-                                                <div class="input-viz__dpad-divider" />
-                                                <div class="input-viz input-viz__mappings" visual-input="DPAD_RIGHT">
-                                                    <svg class="input-viz__dpad-arrow input-viz__dpad-arrow--right" src="icons/VizMap/DPadArrow.svg" />
-                                                    <div
-                                                        class="input-config__visual-mapping"
-                                                        data-for="cur_binding, i : inputs.DPAD_RIGHT"
-                                                    >
-                                                        <div>{{cur_binding}}</div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="input-config__visual-quarter-right">
-                                        <div class="input-config__main-buttons">
-                                            <div
-                                                class="input-viz input-viz__button input-viz__button--sm input-viz__button--Start"
-                                                visual-input="START"
-                                            >
-                                                <svg src="icons/VizMap/ButtonSmall.svg" />
-                                                <div class="input-viz__mappings">
-                                                    <div
-                                                        class="input-config__visual-mapping"
-                                                        data-for="cur_binding, i : inputs.START"
-                                                    >
-                                                        <div>{{cur_binding}}</div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div
-                                                class="input-viz input-viz__button input-viz__button--lg input-viz__button--B"
-                                                visual-input="B"
-                                            >
-                                                <svg src="icons/VizMap/ButtonLarge.svg" />
-                                                <div class="input-viz__mappings">
-                                                    <div
-                                                        class="input-config__visual-mapping"
-                                                        data-for="cur_binding, i : inputs.B"
-                                                    >
-                                                        <div>{{cur_binding}}</div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div
-                                                class="input-viz input-viz__button input-viz__button--lg input-viz__button--A"
-                                                visual-input="A"
-                                            >
-                                                <svg src="icons/VizMap/ButtonLarge.svg" />
-                                                <div class="input-viz__mappings">
-                                                    <div
-                                                        class="input-config__visual-mapping"
-                                                        data-for="cur_binding, i : inputs.A"
-                                                    >
-                                                        <div>{{cur_binding}}</div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div class="input-config__c-buttons">
-                                            <div class="input-config__c-buttons-lr">
-                                                <div
-                                                    class="input-viz input-viz__button input-viz__button--md input-viz__button--C"
-                                                    visual-input="C_LEFT"
-                                                >
-                                                    <svg src="icons/VizMap/ButtonMedium.svg" />
-                                                    <div class="input-viz__mappings">
-                                                        <div
-                                                            class="input-config__visual-mapping"
-                                                            data-for="cur_binding, i : inputs.C_LEFT"
-                                                        >
-                                                            <div>{{cur_binding}}</div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                                <div
-                                                    class="input-viz input-viz__button input-viz__button--md input-viz__button--C"
-                                                    visual-input="C_RIGHT"
-                                                >
-                                                    <svg src="icons/VizMap/ButtonMedium.svg" />
-                                                    <div class="input-viz__mappings">
-                                                        <div
-                                                            class="input-config__visual-mapping"
-                                                            data-for="cur_binding, i : inputs.C_RIGHT"
-                                                        >
-                                                            <div>{{cur_binding}}</div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div class="input-config__c-buttons-du">
-                                                <div
-                                                    class="input-viz input-viz__button input-viz__button--md input-viz__button--C"
-                                                    visual-input="C_DOWN"
-                                                >
-                                                    <svg src="icons/VizMap/ButtonMedium.svg" />
-                                                    <div class="input-viz__mappings">
-                                                        <div
-                                                            class="input-config__visual-mapping"
-                                                            data-for="cur_binding, i : inputs.C_DOWN"
-                                                        >
-                                                            <div>{{cur_binding}}</div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                                <div
-                                                    class="input-viz input-viz__button input-viz__button--sm input-viz__button--C"
-                                                    visual-input="C_UP"
-                                                >
-                                                    <svg src="icons/VizMap/ButtonMedium.svg" />
-                                                    <div class="input-viz__mappings">
-                                                        <div
-                                                            class="input-config__visual-mapping"
-                                                            data-for="cur_binding, i : inputs.C_UP"
-                                                        >
-                                                            <div>{{cur_binding}}</div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <!-- bottom half -->
-                                <div class="input-config__visual-half input-config__visual-half--bottom">
-                                    <div
-                                        class="input-viz input-viz__Z"
-                                        visual-input="Z"
-                                    >
-                                        <svg src="icons/VizMap/Target.svg" />
-                                        <div class="input-viz__mappings">
-                                            <div
-                                                class="input-config__visual-mapping"
-                                                data-for="cur_binding, i : inputs.Z"
-                                            >
-                                                <div>{{cur_binding}}</div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div
-                                        class="input-viz input-viz__R"
-                                        visual-input="R"
-                                    >
-                                        <svg src="icons/VizMap/Shield.svg" />
-                                        <div class="input-viz__mappings">
-                                            <div
-                                                class="input-config__visual-mapping"
-                                                data-for="cur_binding, i : inputs.R"
-                                            >
-                                                <div>{{cur_binding}}</div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div
-                                        class="input-viz input-viz__L"
-                                        visual-input="L"
-                                    >
-                                        <svg src="icons/VizMap/Map.svg" />
-                                        <div class="input-viz__mappings">
-                                            <div
-                                                class="input-config__visual-mapping"
-                                                data-for="cur_binding, i : inputs.L"
-                                            >
-                                                <div>{{cur_binding}}</div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </form>
-    </body>
-</template>
-    

assets/config_menu/debug.rml

@@ -1,13 +0,0 @@
-<template name="config-menu__debug">
-    <head>
-    </head>
-    <body>
-        <form class="config__form">
-            <div class="config__wrapper">
-                <div class="config-debug">
-                </div>
-            </div>
-        </form>
-    </body>
-</template>
-    

assets/config_menu/general.rml

@@ -1,297 +0,0 @@
-<template name="config-menu__general">
-    <head>
-    </head>
-    <body>
-        <form class="config__form" id="conf-general__form">
-            <div class="config__hz-wrapper" id="conf-general__hz-wrapper">
-                <!-- Options -->
-                <div class="config__wrapper" data-event-mouseout="set_cur_config_index(-1)" id="conf-general__wrapper">
-                    <!-- rumble strength -->
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(1)">
-                        <label class="config-option__title">Rumble Strength</label>
-                        <div class="config-option__range-wrapper config-option__list">
-                            <label class="config-option__range-label">{{rumble_strength}}%</label>
-                            <input
-                                class="nav-vert"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(1)"
-                                id="rumble_strength_input"
-                                type="range"
-                                min="0"
-                                max="100"
-                                style="flex: 1; margin: 0dp;"
-                                data-value="rumble_strength"
-                            />
-                        </div>
-                    </div>
-
-                    <!-- gyro sensitivity -->
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(2)">
-                        <label class="config-option__title">Gyro Sensitivity</label>
-                        <div class="config-option__range-wrapper config-option__list">
-                            <label class="config-option__range-label">{{gyro_sensitivity}}%</label>
-                            <input
-                                class="nav-vert"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(2)"
-                                id="gyro_sensitivity_input"
-                                type="range"
-                                min="0"
-                                max="100"
-                                style="flex: 1; margin: 0dp;"
-                                data-value="gyro_sensitivity"
-                            />
-                        </div>
-                    </div>
-
-                    <!-- mouse sensitivity -->
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(3)">
-                        <label class="config-option__title">Mouse Sensitivity</label>
-                        <div class="config-option__range-wrapper config-option__list">
-                            <label class="config-option__range-label">{{mouse_sensitivity}}%</label>
-                            <input
-                                class="nav-vert"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(3)"
-                                id="mouse_sensitivity_input"
-                                type="range"
-                                min="0"
-                                max="100"
-                                style="flex: 1; margin: 0dp;"
-                                data-value="mouse_sensitivity"
-                            />
-                        </div>
-                    </div>
-                    
-                    <!-- joystick deadzone -->
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(4)">
-                        <label class="config-option__title">Joystick Deadzone</label>
-                        <div class="config-option__range-wrapper config-option__list">
-                            <label class="config-option__range-label">{{joystick_deadzone}}%</label>
-                            <input
-                                class="nav-vert"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(4)"
-                                id="joystick_deadzone_input"
-                                type="range"
-                                min="0"
-                                max="100"
-                                style="flex: 1; margin: 0dp; nav-down: #bg_input_enabled"
-                                data-value="joystick_deadzone"
-                            />
-                        </div>
-                    </div>
-
-                    <!-- background input -->
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(5)" id="conf-general__Background-Input">
-                        <label class="config-option__title">Background Input</label>
-                        <div class="config-option__list">
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(5)"
-                                name="background_input_mode"
-                                data-checked="background_input_mode"
-                                value="On"
-                                id="bg_input_enabled"
-                                style="nav-up: #joystick_deadzone_input; nav-down: #camera_inversion_none"
-                            />
-                            <label class="config-option__tab-label" for="bg_input_enabled">On</label>
-
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(5)"
-                                name="background_input_mode"
-                                data-checked="background_input_mode"
-                                value="Off"
-                                id="bg_input_disabled"
-                                style="nav-up: #joystick_deadzone_input; nav-down: #camera_inversion_x"
-                            />
-                            <label class="config-option__tab-label" for="bg_input_disabled">Off</label>
-                        </div>
-                    </div>
-                    
-                    <!-- camera inversion -->
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(7)">
-                        <label class="config-option__title">Aiming Camera Mode</label>
-                        <div class="config-option__list">
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(7)"
-                                name="camera_invert_mode"
-                                data-checked="camera_invert_mode"
-                                value="InvertNone"
-                                id="camera_inversion_none"
-                                style="nav-up: #bg_input_enabled; nav-down: #analog_cam_enabled"
-                            />
-                            <label class="config-option__tab-label" for="camera_inversion_none">None</label>
-
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(7)"
-                                name="camera_invert_mode"
-                                data-checked="camera_invert_mode"
-                                value="InvertX"
-                                id="camera_inversion_x"
-                                style="nav-up: #bg_input_disabled; nav-down: #analog_cam_disabled"
-                            />
-                            <label class="config-option__tab-label" for="camera_inversion_x">Invert X</label>
-
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(7)"
-                                name="camera_invert_mode"
-                                data-checked="camera_invert_mode"
-                                value="InvertY"
-                                id="camera_inversion_y"
-                                style="nav-up: #bg_input_disabled; nav-down: #analog_cam_disabled"
-                            />
-                            <label class="config-option__tab-label" for="camera_inversion_y">Invert Y</label>
-
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(7)"
-                                name="camera_invert_mode"
-                                data-checked="camera_invert_mode"
-                                value="InvertBoth"
-                                id="camera_inversion_both"
-                                style="nav-up: #bg_input_disabled; nav-down: #analog_cam_disabled"
-                            />
-                            <label class="config-option__tab-label" for="camera_inversion_both">Invert Both</label>
-                        </div>
-                    </div>
-                    
-                    <!-- analog camera -->
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(8)">
-                        <label class="config-option__title">Analog Camera</label>
-                        <div class="config-option__list">
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(8)"
-                                name="analog_cam_mode"
-                                data-checked="analog_cam_mode"
-                                value="On"
-                                id="analog_cam_enabled"
-                                style="nav-up: #camera_inversion_none; nav-down: #analog_camera_inversion_none"
-                            />
-                            <label class="config-option__tab-label" for="analog_cam_enabled">On</label>
-
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(8)"
-                                name="analog_cam_mode"
-                                data-checked="analog_cam_mode"
-                                value="Off"
-                                id="analog_cam_disabled"
-                                style="nav-up: #camera_inversion_x; nav-down: #analog_camera_inversion_x"
-                            />
-                            <label class="config-option__tab-label" for="analog_cam_disabled">Off</label>
-                        </div>
-                    </div>
-                    
-                    <!-- analog camera inversion -->
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(9)">
-                        <label class="config-option__title">Analog Camera Mode</label>
-                        <div class="config-option__list">
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(9)"
-                                name="analog_camera_invert_mode"
-                                data-checked="analog_camera_invert_mode"
-                                value="InvertNone"
-                                id="analog_camera_inversion_none"
-                                style="nav-up: #analog_cam_enabled;"
-                            />
-                            <label class="config-option__tab-label" for="analog_camera_inversion_none">None</label>
-
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(9)"
-                                name="analog_camera_invert_mode"
-                                data-checked="analog_camera_invert_mode"
-                                value="InvertX"
-                                id="analog_camera_inversion_x"
-                                style="nav-up: #analog_cam_disabled;"
-                            />
-                            <label class="config-option__tab-label" for="analog_camera_inversion_x">Invert X</label>
-
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(9)"
-                                name="analog_camera_invert_mode"
-                                data-checked="analog_camera_invert_mode"
-                                value="InvertY"
-                                id="analog_camera_inversion_y"
-                                style="nav-up: #analog_cam_disabled;"
-                            />
-                            <label class="config-option__tab-label" for="analog_camera_inversion_y">Invert Y</label>
-
-                            <input
-                                type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(9)"
-                                name="analog_camera_invert_mode"
-                                data-checked="analog_camera_invert_mode"
-                                value="InvertBoth"
-                                id="analog_camera_inversion_both"
-                                style="nav-up: #analog_cam_disabled;"
-                            />
-                            <label class="config-option__tab-label" for="analog_camera_inversion_both">Invert Both</label>
-                        </div>
-                    </div>
-                </div>
-                <!-- Descriptions -->
-                <div class="config__wrapper">
-                    <p data-if="cur_config_index == 1">
-                        Controls the strength of rumble when using a controller that supports it. <b>Setting this to zero will disable rumble.</b>
-                    </p>
-                    <p data-if="cur_config_index == 2">
-                        Controls the sensitivity of gyro aiming when using items in first person for controllers that support it. <b>Setting this to zero will disable gyro.</b>
-                        <br />
-                        <br />
-                        <b>Note: To recalibrate controller gyro, set the controller down on a still, flat surface for 5 seconds.</b>
-                    </p>
-                    <p data-if="cur_config_index == 3">
-                        Controls the sensitivity of mouse aiming when using items in first person. <b>Setting this to zero will disable mouse aiming.</b>
-                        <br />
-                        <br />
-                        <b>Note: This option does not allow mouse buttons to activate items. Mouse aiming is intended to be used with inputs that are mapped to mouse movement, such as gyro on Steam Deck.</b>
-                    </p>
-                    <p data-if="cur_config_index == 4">
-                        Applies a deadzone to joystick inputs.
-                    </p>
-                    <p data-if="cur_config_index == 5">
-                        Allows the game to read controller input when out of focus.
-                        <br/>
-                        <b>This setting does not affect keyboard input.</b>
-                    </p>
-                    <p data-if="cur_config_index == 7">
-                        Inverts the camera controls for first-person aiming. <b>Invert Y</b> is the default and matches the original game.
-                    </p>
-                    <p data-if="cur_config_index == 8">
-                        Enables an analog "free" camera similar to later entries in the series that's mapped to the right analog stick on the controller.
-                        <br/>
-                        <br/>
-                        When you move the right stick, the camera will enter free mode and stop centering behind Link. Press the <b>Target</b> button at any time to go back into the normal camera mode. The camera will also return to normal mode after a cutscene plays or when you move between areas.
-                        <br/>
-                        <br/>
-                        This option also enables right stick control while looking and aiming.
-                    </p>
-                    <p data-if="cur_config_index == 9">
-                        Inverts the camera controls for the analog camera if it's enabled. <b>None</b> is the default.
-                    </p>
-                </div>
-            </div>
-        </form>
-    </body>
-</template>

assets/config_menu/graphics.rml

@@ -1,325 +0,0 @@
-<template name="config-menu__graphics">
-    <head>
-    </head>
-    <body>
-        <form class="config__form">
-            <div class="config__hz-wrapper">
-                <div class="config__wrapper" data-event-mouseout="set_cur_config_index(-1)">
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(0)">
-                        <label class="config-option__title">Resolution</label>
-                        <div class="config-option__list">
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(0)"
-                                name="resolution"
-                                data-checked="res_option"
-                                value="Original"
-                                id="res_original"
-                                style="nav-up:#tab_graphics; nav-down: #ds_windowed"
-                                data-attr-style="res_option == 'Auto' ? 'nav-up:#tab_graphics; nav-down: #ar_original' : 'nav-up:#tab_graphics; nav-down: #ds_windowed'"
-                            />
-                            <label class="config-option__tab-label" for="res_original">Original</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(0)"
-                                name="resolution"
-                                data-checked="res_option"
-                                value="Original2x"
-                                id="res_2x"
-                                style="nav-up:#tab_graphics; nav-down: #ds_2x"
-                                data-attr-style="res_option == 'Auto' ? 'nav-up:#tab_graphics; nav-down: #ar_expand' : 'nav-up:#tab_graphics; nav-down: #ds_2x'"
-                            />
-                            <label class="config-option__tab-label" for="res_2x">Original 2x</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(0)"
-                                name="resolution"
-                                data-checked="res_option"
-                                value="Auto"
-                                id="res_auto"
-                                style="nav-up:#tab_graphics; nav-down: #ds_4x"
-                                data-attr-style="res_option == 'Auto' ? 'nav-up:#tab_graphics; nav-down: #ar_expand' : 'nav-up:#tab_graphics; nav-down: #ds_4x'"
-                            />
-                            <label class="config-option__tab-label" for="res_auto">Auto</label>
-                        </div>
-                    </div>
-
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(1)">
-                        <label class="config-option__title">Downsampling Quality</label>
-                        <div class="config-option__list">
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(1)"
-                                name="downsampling"
-                                data-attrif-disabled="res_option == 'Auto'"
-                                data-checked="ds_option"
-                                value="1"
-                                id="ds_windowed"
-                                style="nav-up: #res_original; nav-down: #ar_original"
-                            />
-                            <label class="config-option__tab-label" for="ds_windowed">Off</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(1)"
-                                name="downsampling"
-                                data-attrif-disabled="res_option == 'Auto'"
-                                data-checked="ds_option"
-                                value="2"
-                                id="ds_2x"
-                                style="nav-up: #res_2x; nav-down: #ar_expand"
-                            />
-                            <label class="config-option__tab-label" for="ds_2x">2x</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(1)"
-                                name="downsampling"
-                                data-attrif-disabled="res_option == 'Auto'"
-                                data-checked="ds_option"
-                                value="4"
-                                id="ds_4x"
-                                style="nav-up: #res_auto; nav-down: #ar_expand"
-                            />
-                            <label class="config-option__tab-label" for="ds_4x">4x</label>
-                            <div class="config-option__details">{{ds_info}}</div>
-                        </div>
-                    </div>
-
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(2)">
-                        <label class="config-option__title">Aspect Ratio</label>
-                        <div class="config-option__list">
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(2)"
-                                name="aspectratio"
-                                data-checked="ar_option"
-                                value="Original"
-                                id="ar_original"
-                                style="nav-up: #ds_windowed; nav-down: #wm_windowed"
-                                data-attr-style="res_option == 'Auto' ? 'nav-up:#res_original; nav-down: #wm_windowed' : 'nav-up:#ds_windowed; nav-down: #wm_windowed'"
-                            />
-                            <label class="config-option__tab-label" for="ar_original">Original</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(2)"
-                                name="aspectratio"
-                                data-checked="ar_option"
-                                value="Expand"
-                                id="ar_expand"
-                                style="nav-up: #ds_2x; nav-down: #wm_fullscreen"
-                                data-attr-style="res_option == 'Auto' ? 'nav-up:#res_2x; nav-down: #wm_fullscreen' : 'nav-up:#ds_2x; nav-down: #wm_fullscreen'"
-                            />
-                            <label class="config-option__tab-label" for="ar_expand">Expand</label>
-                        </div>
-                    </div>
-
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(3)">
-                        <label class="config-option__title">Window Mode</label>
-                        <div class="config-option__list">
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(3)"
-                                name="windowmode"
-                                data-checked="wm_option"
-                                value="Windowed"
-                                id="wm_windowed"
-                                style="nav-up: #ar_original; nav-down: #rr_original"
-                            />
-                            <label class="config-option__tab-label" for="wm_windowed">Windowed</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(3)"
-                                name="windowmode"
-                                data-checked="wm_option"
-                                value="Fullscreen"
-                                id="wm_fullscreen"
-                                style="nav-up: #ar_expand; nav-down: #rr_display"
-                            />
-                            <label class="config-option__tab-label" for="wm_fullscreen">Fullscreen</label>
-                        </div>
-                    </div>
-
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(4)">
-                        <label class="config-option__title">Framerate</label>
-                        <div class="config-option__list">
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)" 
-                                data-event-focus="set_cur_config_index(4)"
-                                name="refreshrate"
-                                data-checked="rr_option"
-                                value="Original"
-                                id="rr_original"
-                                data-attr-style="rr_option=='Manual' ? 'nav-up: #wm_windowed; nav-down: #rr_manual_input' : 'nav-up: #wm_windowed; nav-down: #msaa_none'"
-                            />
-                            <label class="config-option__tab-label" for="rr_original">Original</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)" 
-                                data-event-focus="set_cur_config_index(4)"
-                                name="refreshrate"
-                                data-checked="rr_option"
-                                value="Display"
-                                id="rr_display"
-                                style="nav-up: #wm_fullscreen"
-                                data-style-nav-down="rr_option=='Manual' ? '#rr_manual_input' : (msaa2x_supported ? '#msaa_2x' : '#msaa_none')"
-                            />
-                            <label class="config-option__tab-label" for="rr_display">Display</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)" 
-                                data-event-focus="set_cur_config_index(4)"
-                                name="refreshrate"
-                                data-checked="rr_option"
-                                value="Manual"
-                                id="rr_manual"
-                                style="nav-up: #wm_fullscreen"
-                                data-style-nav-down="rr_option=='Manual' ? '#rr_manual_input' : (msaa4x_supported ? '#msaa_4x' : (msaa2x_supported ? '#msaa_2x' : '#msaa_none'))"
-                            />
-                            <label class="config-option__tab-label" for="rr_manual">Manual</label>
-                        </div>
-                        <div data-if="rr_option=='Manual'" class="config-option__range-wrapper config-option__list">
-                            <label class="config-option__range-label">{{rr_manual_value}}</label>
-                            <input
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(4)"
-                                id="rr_manual_input"
-                                type="range"
-                                min="20"
-                                max="360"
-                                style="flex:1;margin: 0dp;nav-up:#rr_manual;nav-down:#msaa_none;"
-                                data-value="rr_manual_value"
-                            />
-                        </div>
-                    </div>
-
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(5)">
-                        <label class="config-option__title">MS Anti-Aliasing</label>
-                        <div class="config-option__list">
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(5)"
-                                name="antialiasing"
-                                data-checked="msaa_option"
-                                value="None"
-                                id="msaa_none"
-                                data-attr-style="rr_option=='Manual' ? 'nav-up: #rr_manual_input; nav-down: #hr_original' : 'nav-up: #rr_original; nav-down: #hr_original'"
-                            />
-                            <label class="config-option__tab-label" for="msaa_none">None</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(5)"
-                                name="antialiasing"
-                                data-attrif-disabled="!msaa2x_supported"
-                                data-checked="msaa_option"
-                                value="MSAA2X"
-                                id="msaa_2x"
-                                data-attr-style="rr_option=='Manual' ? 'nav-up: #rr_manual_input; nav-down: #hr_16_9' : 'nav-up: #rr_display; nav-down: #hr_16_9'"
-                                data-style-nav-right="msaa4x_supported ? '#msaa_4x' : 'none'"
-                            />
-                            <label class="config-option__tab-label" for="msaa_2x">2x</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(5)"
-                                name="antialiasing"
-                                data-attrif-disabled="!msaa4x_supported"
-                                data-checked="msaa_option"
-                                value="MSAA4X"
-                                id="msaa_4x"
-                                data-attr-style="rr_option=='Manual' ? 'nav-up: #rr_manual_input; nav-down: #hr_full' : 'nav-up: #rr_manual; nav-down: #hr_full'"
-                            />
-                            <label class="config-option__tab-label" for="msaa_4x">4x</label>
-                            <div class="config-option__details" data-if="!sample_positions_supported">Not available (missing sample positions support)</div>
-                        </div>
-                    </div>
-
-                    <div class="config-option" data-event-mouseover="set_cur_config_index(6)">
-                        <label class="config-option__title">HUD Placement</label>
-                        <div class="config-option__list">
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(6)"
-                                name="hr-option"
-                                data-checked="hr_option"
-                                value="Original"
-                                id="hr_original"
-                                style="nav-up: #msaa_none; nav-down: #apply_button"
-                            />
-                            <label class="config-option__tab-label" for="hr_original">Original</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(6)"
-                                name="hr-option"
-                                data-checked="hr_option"
-                                value="Clamp16x9"
-                                id="hr_16_9"
-                                style="nav-up: #msaa_2x; nav-down: #apply_button"
-                                data-style-nav-up="msaa2x_supported ? '#msaa_2x' : '#msaa_none'"
-                            />
-                            <label class="config-option__tab-label" for="hr_16_9">16:9</label>
-                            <input type="radio"
-                                data-event-blur="set_cur_config_index(-1)"
-                                data-event-focus="set_cur_config_index(6)"
-                                name="hr-option"
-                                data-checked="hr_option"
-                                value="Full"
-                                id="hr_full"
-                                style="nav-up: #msaa_4x; nav-down: #apply_button"
-                                data-style-nav-up="msaa4x_supported ? '#msaa_4x' : (msaa2x_supported ? '#msaa_2x' : '#msaa_none')"
-                            />
-                            <label class="config-option__tab-label" for="hr_full">Expand</label>
-                        </div>
-                    </div>
-
-                </div>
-                <div class="config__wrapper">
-                    <p data-if="cur_config_index == 0">
-                        Sets the output resolution of the game. <b>Original</b> matches the game's original 240p resolution. <b>Original 2x</b> will render at 480p. <b>Auto</b> will scale based on the game window's resolution.
-                    </p>
-                    <p data-if="cur_config_index == 1">
-                        Renders at a higher resolution and scales it down to the output resolution for increased quality. Only available in <b>Original</b> and <b>Original 2x</b> resolution.
-                        <br />
-                        <br />
-                        Note: <b>4x</b> downsampling quality at <b>Original 2x</b> resolution may cause performance issues on low end devices, as it will cause the game to render <i>at almost 4k internal resolution</i>.
-                    </p>
-                    <p data-if="cur_config_index == 2">
-                        Sets the horizontal aspect ratio. <b>Original</b> uses the game's original 4:3 aspect ratio. <b>Expand</b> will adjust to match the game window's aspect ratio.
-                    </p>
-                    <p data-if="cur_config_index == 3">
-                        Sets whether the game should display <b>Windowed</b> or <b>Fullscreen</b>. You can also use <b>F11</b> or <b>Alt + Enter</b> to toggle this option.
-                    </p>
-                    <p data-if="cur_config_index == 4">
-                        Sets the game's output framerate. This option does not affect gameplay.
-                        <br />
-                        <br />
-                        Note: If you have issues with <b>Display</b> mode while using an external frame limiter, use <b>Manual</b> mode instead and configure it to that same frame limit.
-                        <br />
-                        <br />
-                        <b>Detected display refresh rate: {{display_refresh_rate}}hz</b>
-                    </p>
-                    <p data-if="cur_config_index == 5">
-                        Sets the multisample anti-aliasing (MSAA) quality level. This reduces jagged edges in the final image at the expense of rendering performance.
-                        <br />
-                        <br />
-                        <b>Note: This option won't be available if your GPU does not support programmable MSAA sample positions, as it is currently required to avoid rendering glitches.</b>
-                    </p>
-                    <p data-if="cur_config_index == 6">
-                        Adjusts the placement of HUD elements to fit the selected aspect ratio. <b>Expand</b> will use the aspect ratio of the game's output window.
-                    </p>
-                </div>
-            </div>
-            <div class="config__footer">
-                <!-- this empty div makes sure Apply button gets right aligned -->
-                <div />
-                <div>
-                    <button
-                        class="button button--secondary"
-                        nav-return="rr_manual"
-                        data-attrif-disabled="!options_changed"
-                        onclick="apply_options"
-                        id="apply_button"
-                        style="nav-up:#hr_original"
-                    >
-                        <div class="button__label">Apply<span class="prompt-font-sm">{{gfx_help__apply}}</span></div>
-                    </button>
-                </div>
-            </div>
-        </form>
-    </body>
-</template>

assets/config_menu/mods.rml

@@ -1,9 +0,0 @@
-<template name="config-menu__mods">
-    <head>
-    </head>
-    <body>
-        <form class="config__form">
-            <recomp-mod-menu id="menu_mods" />
-        </form>
-    </body>
-</template>

assets/config_menu/sound.rml

@@ -1,89 +0,0 @@
-<template name="config-menu__sound">
-    <head>
-    </head>
-    <body>
-        <form class="config__form">
-            <div class="config__hz-wrapper">
-                <!-- Options -->
-                <div class="config__wrapper" data-event-mouseout="set_cur_config_index(-1)">
-                        <div class="config-option" data-event-mouseover="set_cur_config_index(0)">
-                            <label class="config-option__title">Main Volume</label>
-                            <div class="config-option__range-wrapper config-option__list">
-                                <label class="config-option__range-label">{{main_volume}}%</label>
-                                <input
-                                    data-event-blur="set_cur_config_index(-1)"
-                                    data-event-focus="set_cur_config_index(0)"
-                                    class="nav-vert"
-                                    id="main_volume_input"
-                                    type="range"
-                                    min="0"
-                                    max="100"
-                                    style="flex: 1; margin: 0dp; nav-up: #tab_sound; nav-down: #bgm_volume_input;"
-                                    data-value="main_volume"
-                                />
-                            </div>
-                        </div>
-                        <div class="config-option" data-event-mouseover="set_cur_config_index(1)">
-                            <label class="config-option__title">Background Music Volume</label>
-                            <div class="config-option__range-wrapper config-option__list">
-                                <label class="config-option__range-label">{{bgm_volume}}%</label>
-                                <input
-                                    data-event-blur="set_cur_config_index(-1)"
-                                    data-event-focus="set_cur_config_index(1)"
-                                    class="nav-vert"
-                                    id="bgm_volume_input"
-                                    type="range"
-                                    min="0"
-                                    max="100"
-                                    style="flex: 1; margin: 0dp; nav-up: #main_volume_input; nav-down: #lhb_on;"
-                                    data-value="bgm_volume"
-                                />
-                            </div>
-                        </div>
-
-                        <div class="config-option" data-event-mouseover="set_cur_config_index(2)">
-                            <label class="config-option__title">Low Health Beeps</label>
-                            <div class="config-option__list">
-                                <input
-                                    type="radio"
-                                    data-event-blur="set_cur_config_index(-1)"
-                                    data-event-focus="set_cur_config_index(2)"
-                                    name="lhb"
-                                    data-checked="low_health_beeps_enabled"
-                                    value="1"
-                                    id="lhb_on"
-                                    style="nav-up: #bgm_volume_input"
-                                />
-                                <label class="config-option__tab-label" for="lhb_on">On</label>
-
-                                <input
-                                    type="radio"
-                                    data-event-blur="set_cur_config_index(-1)"
-                                    data-event-focus="set_cur_config_index(2)"
-                                    name="lhb"
-                                    data-checked="low_health_beeps_enabled"
-                                    value="0"
-                                    id="lhb_off"
-                                    style="nav-up: #bgm_volume_input"
-                                />
-                                <label class="config-option__tab-label" for="lhb_off">Off</label>
-                            </div>
-                        </div>
-                </div>
-                <!-- Descriptions -->
-                <div class="config__wrapper">
-					<p data-if="cur_config_index == 0">
-						Controls the main volume of the game.
-					</p>
-                    <p data-if="cur_config_index == 1">
-                        Controls the overall volume of background music.
-                    </p>
-                    <p data-if="cur_config_index == 2">
-                        Toggles whether or not the low-health beeping sound plays.
-                    </p>
-                </div>
-            </div>
-        </form>
-    </body>
-</template>
-    

assets/config_sub_menu.rml

@@ -1,70 +0,0 @@
-<rml>
-<head>
-    <link type="text/rcss" href="rml.rcss"/>
-    <link type="text/rcss" href="recomp.rcss"/>
-    <title>Inventory</title>
-    <style>
-        body
-        {
-            width: 100%;
-            height: 100%;
-        }
-
-        /* Hide the window icon. */
-        div#title_bar div#icon
-        {
-            display: none;
-        }
-        .flex-grid {
-            display: flex;
-        }
-        .col {
-            flex: 1;
-            text-align: center;
-        }
-    </style>
-</head>
-<body class="window">
-    <!-- <handle move_target="#document"> -->
-        <div id="window" class="rmlui-window" style="display:flex; flex-flow: column; background-color:rgba(0,0,0,0)" onkeydown="config_keydown">
-            <div class="centered-page" onclick="close_config_menu_backdrop">
-                <div class="centered-page__modal">
-                    <div class="config__icon-buttons">
-                        <button
-                            class="icon-button"
-                            onclick="open_quit_game_prompt"
-                            id="config__quit-game-button"
-                        >
-                            <svg src="icons/Quit.svg" />
-                        </button>
-                        <button
-                            class="icon-button"
-                            onclick="close_config_menu"
-                            id="config__close-menu-button"
-                        >
-                            <svg src="icons/X.svg" />
-                        </button>
-                    </div>
-                    <recomp-config-sub-menu id="config_sub_menu" />
-                </div>
-                <div
-                    class="centered-page__controls"
-                    data-model="nav_help_model"
-                >
-                    <label>
-                        <span>Navigate</span>
-                        <span class="prompt-font-sm">{{nav_help__navigate}}</span>
-                    </label>
-                    <label>
-                        <span>Accept</span>
-                        <span class="prompt-font-sm">{{nav_help__accept}}</span>
-                    </label>
-                    <label>
-                        <span>Exit</span>
-                        <span class="prompt-font-sm">{{nav_help__exit}}</span>
-                    </label>
-                </div>
-            </div>
-        </div>
-</body>
-</rml>

assets/icons/Caret.svg

@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4 11L15.2929 22.2929C15.6834 22.6834 16.3166 22.6834 16.7071 22.2929L28 11" stroke="#FFFFFF" stroke-width="8" stroke-linecap="round"/>
+</svg>

assets/icons/Cont.svg

@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.72625 23.3925C8.13475 23.0659 8.61021 22.3958 9.032 21.7129C9.78396 20.4953 11.0499 19.6669 12.4578 19.6669H19.5422C20.9501 19.6669 22.216 20.4953 22.968 21.7129C23.3898 22.3958 23.8653 23.0659 24.2738 23.3925C25.2857 24.2015 26.6008 24.2035 27.6585 23.3925C28.4268 22.8033 29 21.7232 29 20.2983C29 18.8735 28.6384 12.9609 27.6585 9.98045C26.6786 7 23.4285 7 16 7C8.57147 7 5.32145 7 4.34153 9.98045C3.36162 12.9609 3 18.8735 3 20.2983C3 21.7232 3.5732 22.8033 4.34153 23.3925C5.39916 24.2035 6.71431 24.2015 7.72625 23.3925Z" stroke="white" stroke-width="4"/>
+</svg>

assets/icons/Keyboard.svg

@@ -0,0 +1,3 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M27 7C29.2091 7 31 8.79086 31 11V21C31 23.2091 29.2091 25 27 25H5C2.79086 25 1 23.2091 1 21V11C1 8.79086 2.79086 7 5 7H27ZM5 19V21H7V19H5ZM9 19V21H23V19H9ZM25 19V21H27V19H25ZM5 15V17H9V15H5ZM11 15V17H13V15H11ZM15 15V17H17V15H15ZM19 15V17H21V15H19ZM23 15V17H27V15H23ZM5 11V13H7V11H5ZM9 11V13H11V11H9ZM13 11V13H15V11H13ZM17 11V13H19V11H17ZM21 11V13H23V11H21ZM25 11V13H27V11H25Z" fill="white"/>
+</svg>

assets/icons/PlusKeyboard.svg

@@ -0,0 +1,17 @@
+<svg width="48" height="20" viewBox="0 0 48 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_543_3678)">
+<g clip-path="url(#clip1_543_3678)">
+<path d="M8 5V15" stroke="white" stroke-width="4" stroke-linecap="round"/>
+<path d="M3 10L13 10" stroke="white" stroke-width="4" stroke-linecap="round"/>
+</g>
+<path d="M43 1C45.2091 1 47 2.79086 47 5V15C47 17.2091 45.2091 19 43 19H21C18.7909 19 17 17.2091 17 15V5C17 2.79086 18.7909 1 21 1H43ZM21 13V15H23V13H21ZM25 13V15H39V13H25ZM41 13V15H43V13H41ZM21 9V11H25V9H21ZM27 9V11H29V9H27ZM31 9V11H33V9H31ZM35 9V11H37V9H35ZM39 9V11H43V9H39ZM21 5V7H23V5H21ZM25 5V7H27V5H25ZM29 5V7H31V5H29ZM33 5V7H35V5H33ZM37 5V7H39V5H37ZM41 5V7H43V5H41Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_543_3678">
+<rect width="48" height="20" fill="white"/>
+</clipPath>
+<clipPath id="clip1_543_3678">
+<rect width="16" height="16" fill="white" transform="translate(0 2)"/>
+</clipPath>
+</defs>
+</svg>

assets/icons/Port.svg

@@ -0,0 +1,6 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 3C24.091 3.00019 28.7417 10.0042 28.9902 16.082C29.0372 17.2318 28.8162 18.5326 28.2207 19.4746C27.7079 20.2859 26.8271 21 25 21H7C5.17292 21 4.29117 20.2859 3.77832 19.4746C3.18306 18.5326 2.96285 17.2316 3.00977 16.082C3.25811 10.0041 7.90882 3 16 3Z" stroke="white" stroke-width="4" stroke-linecap="round"/>
+<circle cx="16" cy="14.5" r="2.5" fill="white"/>
+<circle cx="22.5" cy="14.5" r="2.5" fill="white"/>
+<circle cx="9.5" cy="14.5" r="2.5" fill="white"/>
+</svg>

assets/icons/Question.svg

@@ -0,0 +1,5 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.00008 11C9.00008 6.5 12.0002 4 16.0002 4C20.0002 4 23.0002 7 23.0002 11C23.0002 15 20.0002 18 16.0002 18" stroke="white" stroke-width="4" stroke-linecap="round"/>
+<path d="M16 22V18" stroke="white" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"/>
+<circle cx="16" cy="28" r="2" fill="white"/>
+</svg>

assets/icons/RecordSpinner.svg

@@ -0,0 +1,16 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_541_3853)">
+<circle cx="16" cy="28" r="3" fill="white"/>
+<mask id="mask0_541_3853" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="32" height="32">
+<path d="M32 32H16C18.2091 32 20 30.2091 20 28C20 25.7909 18.2091 24 16 24C13.7909 24 12 25.7909 12 28C12 30.2091 13.7909 32 16 32H0V0H32V32Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_541_3853)">
+<circle cx="16" cy="16" r="12" stroke="white" stroke-width="4"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_541_3853">
+<rect width="32" height="32" fill="white"/>
+</clipPath>
+</defs>
+</svg>

assets/launcher.rml

@@ -1,70 +0,0 @@
-<rml>
-	<head>
-		<title>Launcher</title>
-		<link type="text/rcss" href="rml.rcss"/>
-		<link type="text/rcss" href="recomp.rcss"/>
-		<style>
-			body
-			{
-				width: 100%;
-				height: 100%;
-			}
-		</style>
-	</head>
-	<body>
-		<div id="window" data-model="launcher_model">
-			<div class="launcher">
-				<!--<div class="launcher__vertical-split">
-					<div class="launcher__title-quadrant">
-						<button class="subtitle-title" disabled>
-							<div><h3>Banjo: Recompiled</h3></div>
-							<div><h1>Banjo-Tooie</h1></div>
-							<div class="subtitle-title__disclaimer">Coming Soon™</div>
-						</button>
-					</div>
-					<div class="launcher__content-quadrant"></div>
-				</div>-->
-				<div class="launcher__vertical-split launcher__vertical-split--right">
-					<div class="launcher__background-wrapper">
-						<!-- <svg src="[changeme].svg" class="launcher__background-bk" /> -->
-					</div>
-					<div class="launcher__title-quadrant launcher__title-quadrant--right">
-						<button class="subtitle-title subtitle-title--right" selected>
-							<div><h3>Banjo: Recompiled</h3></div>
-							<div><h1>Banjo-Kazooie</h1></div>
-						</button>
-					</div>
-					<div class="launcher__content-quadrant">
-						<button data-if="!bk_rom_valid" onclick="select_rom" class="menu-list-item menu-list-item--right" autofocus>
-							<div class="menu-list-item__bullet">•</div>
-							<div class="menu-list-item__label">Select ROM</div>
-						</button>
-						<button data-if="bk_rom_valid" onclick="start_game" class="menu-list-item menu-list-item--right" autofocus>
-							<div class="menu-list-item__bullet">•</div>
-							<div class="menu-list-item__label">Start game</div>
-						</button>
-						<button onclick="open_controls" class="menu-list-item menu-list-item--right">
-							<div class="menu-list-item__bullet">•</div>
-							<div class="menu-list-item__label">Setup controls</div>
-						</button>
-						<button onclick="open_settings" class="menu-list-item menu-list-item--right">
-							<div class="menu-list-item__bullet">•</div>
-							<div class="menu-list-item__label">Settings</div>
-						</button>
-						<button onclick="open_mods" class="menu-list-item menu-list-item--right">
-							<div class="menu-list-item__bullet">•</div>
-							<div class="menu-list-item__label">Mods</div>
-						</button>
-						<button onclick="exit_game" class="menu-list-item menu-list-item--right">
-							<div class="menu-list-item__bullet">•</div>
-							<div class="menu-list-item__label">Exit</div>
-						</button>
-					</div>
-				</div>
-				<div class="bottom-left">
-					<label>v{{version_number}}</label>
-				</div>
-			</div>
-		</div>
-	</body>
-</rml>

assets/promptfont/promptfont.css

@@ -1,335 +0,0 @@
-@font-face{font-family:'promptfont'; src:url('promptfont.ttf');}
-.pf{font-family:promptfont;}
-.pf-exchange::after{content:'\u2194';}
-.pf-reverse::after{content:'\u2195';}
-.pf-left-trigger-lt::after{content:'\u2196';}
-.pf-right-trigger-rt::after{content:'\u2197';}
-.pf-left-shoulder-lb::after{content:'\u2198';}
-.pf-right-shoulder-rb::after{content:'\u2199';}
-.pf-left-trigger-zl::after{content:'\u219A';}
-.pf-right-trigger-zr::after{content:'\u219B';}
-.pf-left-shoulder-l::after{content:'\u219C';}
-.pf-right-shoulder-r::after{content:'\u219D';}
-.pf-dpad-left::after{content:'\u219E';}
-.pf-dpad-up::after{content:'\u219F';}
-.pf-dpad-right::after{content:'\u21A0';}
-.pf-dpad-down::after{content:'\u21A1';}
-.pf-dpad-left-right::after{content:'\u21A2';}
-.pf-dpad-up-down::after{content:'\u21A3';}
-.pf-button-left-x::after{content:'\u21A4';}
-.pf-button-up-y::after{content:'\u21A5';}
-.pf-button-right-b::after{content:'\u21A6';}
-.pf-button-down-a::after{content:'\u21A7';}
-.pf-left-analog-clockwise::after{content:'\u21A9';}
-.pf-left-analog-counter::after{content:'\u21AA';}
-.pf-right-analog-clockwise::after{content:'\u21AB';}
-.pf-right-analog-counter::after{content:'\u21AC';}
-.pf-both-analog-clockwise::after{content:'\u21AD';}
-.pf-both-analog-counter::after{content:'\u21AE';}
-.pf-left-shoulder-l1::after{content:'\u21B0';}
-.pf-right-shoulder-r1::after{content:'\u21B1';}
-.pf-left-trigger-l2::after{content:'\u21B2';}
-.pf-right-trigger-r2::after{content:'\u21B3';}
-.pf-dpad-left-down::after{content:'\u21B4';}
-.pf-dpad-up-right::after{content:'\u21B5';}
-.pf-analog-clockwise::after{content:'\u21B6';}
-.pf-analog-counter::after{content:'\u21B7';}
-.pf-both-analog-click::after{content:'\u21B9';}
-.pf-left-analog-click::after{content:'\u21BA';}
-.pf-right-analog-click::after{content:'\u21BB';}
-.pf-left-analog-left::after{content:'\u21BC';}
-.pf-right-analog-left::after{content:'\u21BD';}
-.pf-left-analog-up::after{content:'\u21BE';}
-.pf-right-analog-up::after{content:'\u21BF';}
-.pf-left-analog-right::after{content:'\u21C0';}
-.pf-right-analog-right::after{content:'\u21C1';}
-.pf-left-analog-down::after{content:'\u21C2';}
-.pf-right-analog-down::after{content:'\u21C3';}
-.pf-left-analog-left-right::after{content:'\u21C4';}
-.pf-left-analog-up-down::after{content:'\u21C5';}
-.pf-right-analog-left-right::after{content:'\u21C6';}
-.pf-analog-left::after{content:'\u21C7';}
-.pf-analog-up::after{content:'\u21C8';}
-.pf-analog-right::after{content:'\u21C9';}
-.pf-analog-down::after{content:'\u21CA';}
-.pf-left-analog::after{content:'\u21CB';}
-.pf-right-analog::after{content:'\u21CC';}
-.pf-dpad::after{content:'\u21CE';}
-.pf-button-x::after{content:'\u21D0';}
-.pf-button-y::after{content:'\u21D1';}
-.pf-button-b::after{content:'\u21D2';}
-.pf-button-a::after{content:'\u21D3';}
-.pf-analog-left-right::after{content:'\u21D4';}
-.pf-analog-up-down::after{content:'\u21D5';}
-.pf-analog-up-left::after{content:'\u21D6';}
-.pf-analog-up-right::after{content:'\u21D7';}
-.pf-analog-down-right::after{content:'\u21D8';}
-.pf-analog-down-left::after{content:'\u21D9';}
-.pf-left-analog-touch::after{content:'\u21DA';}
-.pf-right-analog-touch::after{content:'\u21DB';}
-.pf-left-trigger-pull::after{content:'\u21DC';}
-.pf-right-trigger-pull::after{content:'\u21DD';}
-.pf-dpad-right-down::after{content:'\u21DE';}
-.pf-dpad-left-up::after{content:'\u21DF';}
-.pf-button-square::after{content:'\u21E0';}
-.pf-button-triangle::after{content:'\u21E1';}
-.pf-button-circle::after{content:'\u21E2';}
-.pf-button-cross::after{content:'\u21E3';}
-.pf-steam-menu::after{content:'\u21E4';}
-.pf-options-menu::after{content:'\u21E5';}
-.pf-dualshock-share::after{content:'\u21E6';}
-.pf-dualshock-touchpad::after{content:'\u21E7';}
-.pf-dualshock-options::after{content:'\u21E8';}
-.pf-gamecube-z::after{content:'\u21E9';}
-.pf-back-trigger-z::after{content:'\u21EA';}
-.pf-button-c::after{content:'\u21EB';}
-.pf-button-z::after{content:'\u21EC';}
-.pf-button-alt-1::after{content:'\u21ED';}
-.pf-button-alt-2::after{content:'\u21EE';}
-.pf-left-analog-any::after{content:'\u21F1';}
-.pf-right-analog-any::after{content:'\u21F2';}
-.pf-analog-any::after{content:'\u21F3';}
-.pf-right-analog-up-down::after{content:'\u21F5';}
-.pf-select-share::after{content:'\u21F7';}
-.pf-start::after{content:'\u21F8';}
-.pf-home-menu::after{content:'\u21F9';}
-.pf-share-capture::after{content:'\u21FA';}
-.pf-burger-menu::after{content:'\u21FB';}
-.pf-minus::after{content:'\u21FD';}
-.pf-plus::after{content:'\u21FE';}
-.pf-joycon-dpad-left::after{content:'\u21FF';}
-.pf-joycon-dpad-up::after{content:'\u2200';}
-.pf-joycon-dpad-right::after{content:'\u2201';}
-.pf-joycon-dpad-down::after{content:'\u2202';}
-.pf-joycon-sl::after{content:'\u2203';}
-.pf-joycon-sr::after{content:'\u2204';}
-.pf-lenovo-legion-quick-settings::after{content:'\u2205';}
-.pf-dualsense-share::after{content:'\u2206';}
-.pf-dualsense-touchpad::after{content:'\u2207';}
-.pf-dualsense-options::after{content:'\u2208';}
-.pf-ayaneo-lc::after{content:'\u2209';}
-.pf-ayaneo-rc::after{content:'\u220A';}
-.pf-ayaneo-wave::after{content:'\u220B';}
-.pf-ayn-home::after{content:'\u220C';}
-.pf-ayn-lcc::after{content:'\u220D';}
-.pf-gpd-c1::after{content:'\u220E';}
-.pf-gpd-c2::after{content:'\u220F';}
-.pf-onexplayer-keyboard::after{content:'\u2210';}
-.pf-onexplayer-turbo::after{content:'\u2211';}
-.pf-m1::after{content:'\u2212';}
-.pf-m2::after{content:'\u2213';}
-.pf-m3::after{content:'\u2214';}
-.pf-y1::after{content:'\u2215';}
-.pf-y2::after{content:'\u2216';}
-.pf-y3::after{content:'\u2217';}
-.pf-onexplayer-function::after{content:'\u2218';}
-.pf-onexplayer-home::after{content:'\u2219';}
-.pf-left-trackpad-any::after{content:'\u2264';}
-.pf-right-trackpad-any::after{content:'\u2265';}
-.pf-left-trackpad-click::after{content:'\u2266';}
-.pf-right-trackpad-click::after{content:'\u2267';}
-.pf-left-trackpad-touch::after{content:'\u2268';}
-.pf-right-trackpad-touch::after{content:'\u2269';}
-.pf-left-trackpad-left::after{content:'\u226E';}
-.pf-right-trackpad-left::after{content:'\u226F';}
-.pf-left-trackpad-up::after{content:'\u2270';}
-.pf-right-trackpad-up::after{content:'\u2271';}
-.pf-left-trackpad-right::after{content:'\u2272';}
-.pf-right-trackpad-right::after{content:'\u2273';}
-.pf-left-trackpad-down::after{content:'\u2274';}
-.pf-right-trackpad-down::after{content:'\u2275';}
-.pf-steamdeck-l4::after{content:'\u2276';}
-.pf-steamdeck-r4::after{content:'\u2277';}
-.pf-steamdeck-l5::after{content:'\u2278';}
-.pf-steamdeck-r5::after{content:'\u2279';}
-.pf-xbox-dpad-left::after{content:'\u227A';}
-.pf-xbox-dpad-up::after{content:'\u227B';}
-.pf-xbox-dpad-right::after{content:'\u227C';}
-.pf-xbox-dpad-down::after{content:'\u227D';}
-.pf-xbox-dpad-left-right::after{content:'\u227E';}
-.pf-xbox-dpad-up-down::after{content:'\u227F';}
-.pf-xbox-dpad-left-up::after{content:'\u2280';}
-.pf-xbox-dpad-right-up::after{content:'\u2281';}
-.pf-xbox-dpad-left-down::after{content:'\u2282';}
-.pf-xbox-dpad-right-down::after{content:'\u2283';}
-.pf-xbox-dpad::after{content:'\u2284';}
-.pf-pin::after{content:'\u2316';}
-.pf-tabs::after{content:'\u23CD';}
-.pf-back::after{content:'\u23CE';}
-.pf-home-screen::after{content:'\u23CF';}
-.pf-horizontal-dots::after{content:'\u23D0';}
-.pf-vertical-dots::after{content:'\u23D1';}
-.pf-hamburger-menu::after{content:'\u23D2';}
-.pf-arrow-left::after{content:'\u23F4';}
-.pf-arrow-up::after{content:'\u23F5';}
-.pf-arrow-right::after{content:'\u23F6';}
-.pf-arrow-down::after{content:'\u23F7';}
-.pf-wasd::after{content:'\u2423';}
-.pf-arrow-keys::after{content:'\u2424';}
-.pf-ijkl::after{content:'\u2425';}
-.pf-fn::after{content:'\u2426';}
-.pf-ctrl::after{content:'\u2427';}
-.pf-alt::after{content:'\u2428';}
-.pf-shift::after{content:'\u2429';}
-.pf-super::after{content:'\u242A';}
-.pf-tab::after{content:'\u242B';}
-.pf-caps::after{content:'\u242C';}
-.pf-backspace::after{content:'\u242D';}
-.pf-enter::after{content:'\u242E';}
-.pf-esc::after{content:'\u242F';}
-.pf-prtsc::after{content:'\u2430';}
-.pf-scrlk::after{content:'\u2431';}
-.pf-pause::after{content:'\u2432';}
-.pf-numlock::after{content:'\u2433';}
-.pf-insert::after{content:'\u2434';}
-.pf-home::after{content:'\u2435';}
-.pf-page-up::after{content:'\u2436';}
-.pf-delete::after{content:'\u2437';}
-.pf-end::after{content:'\u2438';}
-.pf-page-down::after{content:'\u2439';}
-.pf-space::after{content:'\u243A';}
-.pf-gamepad::after{content:'\u243C';}
-.pf-keyboard::after{content:'\u243D';}
-.pf-mouse::after{content:'\u243E';}
-.pf-mouse-and-keyboard::after{content:'\u243F';}
-.pf-f1::after{content:'\u2460';}
-.pf-f2::after{content:'\u2461';}
-.pf-f3::after{content:'\u2462';}
-.pf-f4::after{content:'\u2463';}
-.pf-f5::after{content:'\u2464';}
-.pf-f6::after{content:'\u2465';}
-.pf-f7::after{content:'\u2466';}
-.pf-f8::after{content:'\u2467';}
-.pf-f9::after{content:'\u2468';}
-.pf-f10::after{content:'\u2469';}
-.pf-f11::after{content:'\u246A';}
-.pf-f12::after{content:'\u246B';}
-.pf-empty-keycap::after{content:'\u248F';}
-.pf-1::after{content:'\u24F5';}
-.pf-2::after{content:'\u24F6';}
-.pf-3::after{content:'\u24F7';}
-.pf-4::after{content:'\u24F8';}
-.pf-5::after{content:'\u24F9';}
-.pf-6::after{content:'\u24FA';}
-.pf-7::after{content:'\u24FB';}
-.pf-8::after{content:'\u24FC';}
-.pf-9::after{content:'\u24FD';}
-.pf-0::after{content:'\u24FF';}
-.pf-star::after{content:'\u2605';}
-.pf-skull::after{content:'\u2620';}
-.pf-frown::after{content:'\u2639';}
-.pf-smile::after{content:'\u263A';}
-.pf-empty-heart::after{content:'\u2661';}
-.pf-heart::after{content:'\u2665';}
-.pf-d4::after{content:'\u2673';}
-.pf-d6::after{content:'\u2674';}
-.pf-d8::after{content:'\u2675';}
-.pf-d10::after{content:'\u2676';}
-.pf-d12::after{content:'\u2677';}
-.pf-d20::after{content:'\u2678';}
-.pf-d6-1::after{content:'\u2680';}
-.pf-d6-2::after{content:'\u2681';}
-.pf-d6-3::after{content:'\u2682';}
-.pf-d6-4::after{content:'\u2683';}
-.pf-d6-5::after{content:'\u2684';}
-.pf-d6-6::after{content:'\u2685';}
-.pf-flag::after{content:'\u2691';}
-.pf-gears-options-settings::after{content:'\u2699';}
-.pf-cross::after{content:'\u2717';}
-.pf-question::after{content:'\u2753';}
-.pf-exclamation::after{content:'\u2757';}
-.pf-mouse-button-1::after{content:'\u278A';}
-.pf-mouse-button-2::after{content:'\u278B';}
-.pf-mouse-button-3::after{content:'\u278C';}
-.pf-mouse-button-4::after{content:'\u278D';}
-.pf-mouse-button-5::after{content:'\u278E';}
-.pf-mouse-button-6::after{content:'\u278F';}
-.pf-mouse-button-7::after{content:'\u2790';}
-.pf-mouse-button-8::after{content:'\u2791';}
-.pf-scroll-up::after{content:'\u27F0';}
-.pf-scroll-down::after{content:'\u27F1';}
-.pf-left-click::after{content:'\u27F5';}
-.pf-right-click::after{content:'\u27F6';}
-.pf-middle-click::after{content:'\u27F7';}
-.pf-mouse-left-right::after{content:'\u27FA';}
-.pf-mouse-up-down::after{content:'\u27FB';}
-.pf-mouse-any::after{content:'\u27FC';}
-.pf-box-crate::after{content:'\u2B1B';}
-.pf-playstation::after{content:'\uE000';}
-.pf-xbox::after{content:'\uE001';}
-.pf-nintendo-switch::after{content:'\uE002';}
-.pf-ayaneo::after{content:'\uE003';}
-.pf-lenovo-legion::after{content:'\uE004';}
-.pf-rog-ally-armoury::after{content:'\uE005';}
-.pf-rog-alloy-command::after{content:'\uE006';}
-.pf-apple-mac::after{content:'\uE007';}
-.pf-windows::after{content:'\uE008';}
-.pf-linux::after{content:'\uE009';}
-.pf-bsd::after{content:'\uE00A';}
-.pf-key-0::after{content:'\uFF10';}
-.pf-key-1::after{content:'\uFF11';}
-.pf-key-2::after{content:'\uFF12';}
-.pf-key-3::after{content:'\uFF13';}
-.pf-key-4::after{content:'\uFF14';}
-.pf-key-5::after{content:'\uFF15';}
-.pf-key-6::after{content:'\uFF16';}
-.pf-key-7::after{content:'\uFF17';}
-.pf-key-8::after{content:'\uFF18';}
-.pf-key-9::after{content:'\uFF19';}
-.pf-key-a::after{content:'\uFF21';}
-.pf-key-b::after{content:'\uFF22';}
-.pf-key-c::after{content:'\uFF23';}
-.pf-key-d::after{content:'\uFF24';}
-.pf-key-e::after{content:'\uFF25';}
-.pf-key-f::after{content:'\uFF26';}
-.pf-key-g::after{content:'\uFF27';}
-.pf-key-h::after{content:'\uFF28';}
-.pf-key-i::after{content:'\uFF29';}
-.pf-key-j::after{content:'\uFF2A';}
-.pf-key-k::after{content:'\uFF2B';}
-.pf-key-l::after{content:'\uFF2C';}
-.pf-key-m::after{content:'\uFF2D';}
-.pf-key-n::after{content:'\uFF2E';}
-.pf-key-o::after{content:'\uFF2F';}
-.pf-key-p::after{content:'\uFF30';}
-.pf-key-q::after{content:'\uFF31';}
-.pf-key-r::after{content:'\uFF32';}
-.pf-key-s::after{content:'\uFF33';}
-.pf-key-t::after{content:'\uFF34';}
-.pf-key-u::after{content:'\uFF35';}
-.pf-key-v::after{content:'\uFF36';}
-.pf-key-w::after{content:'\uFF37';}
-.pf-key-x::after{content:'\uFF38';}
-.pf-key-y::after{content:'\uFF39';}
-.pf-key-z::after{content:'\uFF3A';}
-.pf-headphones::after{content:'\u1F3A7';}
-.pf-music::after{content:'\u1F3B6';}
-.pf-fish::after{content:'\u1F41F';}
-.pf-dance-pad::after{content:'\u1F483';}
-.pf-laptop::after{content:'\u1F4BB';}
-.pf-diskette::after{content:'\u1F4BE';}
-.pf-write::after{content:'\u1F4DD';}
-.pf-phone::after{content:'\u1F4F1';}
-.pf-camera::after{content:'\u1F4F7';}
-.pf-speaker::after{content:'\u1F508';}
-.pf-light-gun::after{content:'\u1F52B';}
-.pf-sfx-sound-effect-noise::after{content:'\u1F56C';}
-.pf-steering-wheel::after{content:'\u1F578';}
-.pf-fight-stick-joystick::after{content:'\u1F579';}
-.pf-vr-headset::after{content:'\u1F57B';}
-.pf-vr-controller::after{content:'\u1F57C';}
-.pf-flight-stick::after{content:'\u1F57D';}
-.pf-cpu-processor::after{content:'\u1F5A5';}
-.pf-web-internet-link::after{content:'\u1F5A7';}
-.pf-gpu-graphics-card::after{content:'\u1F5A8';}
-.pf-ram-memory::after{content:'\u1F5AA';}
-.pf-usb-stick::after{content:'\u1F5AB';}
-.pf-database::after{content:'\u1F5AC';}
-.pf-hard-disk-drive::after{content:'\u1F5B4';}
-.pf-screen-video::after{content:'\u1F5B5';}
-.pf-text-entry-edit::after{content:'\u1F5B9';}
-.pf-speaking-voice::after{content:'\u1F5E3';}
-.pf-language::after{content:'\u1F5E9';}
-.pf-exit-quit-leave::after{content:'\u1F6AA';}
-.pf-information::after{content:'\u1F6C8';}
-.pf-shopping-cart::after{content:'\u1F6D2';}

assets/rml.rcss

@@ -1,61 +0,0 @@
-/*
-* Default styles for all the basic elements.
-*/
-
-div
-{
-	display: block;
-}
-
-p
-{
-	display: block;
-}
-
-h1
-{
-	display: block;
-}
-
-em
-{
-	font-style: italic;
-}
-
-strong
-{
-	font-weight: bold;
-}
-
-select
-{
-	text-align: left;
-}
-
-tabset tabs
-{
-	display: block;
-}
-
-table {
-	box-sizing: border-box;
-	display: table;
-}
-tr {
-	box-sizing: border-box;
-	display: table-row;
-}
-td {
-	box-sizing: border-box;
-	display: table-cell;
-}
-col {
-	box-sizing: border-box;
-	display: table-column;
-}
-colgroup {
-	display: table-column-group;
-}
-thead, tbody, tfoot {
-	display: table-row-group;
-}

assets/scss/.nvmrc

@@ -1 +0,0 @@
-iron

assets/scss/.stylelintrc

@@ -1,99 +0,0 @@
-{
-    "extends": [
-        "stylelint-config-recommended",
-        "stylelint-config-standard",
-        "stylelint-config-sass-guidelines",
-        "stylelint-config-property-sort-order-smacss",
-        "stylelint-config-standard-scss"
-    ],
-    "plugins": ["stylelint-scss"],
-    "overrides": [{
-        "files": ["**/*.scss"],
-        "customSyntax": "postcss-scss"
-    }],
-    "rules": {
-        "no-descending-specificity": null,
-        "declaration-empty-line-before": null,
-        "declaration-colon-newline-after": null,
-        "declaration-block-no-duplicate-properties": true,
-        "declaration-block-trailing-semicolon": null,
-        "declaration-no-important": true,
-        "declaration-property-value-disallowed-list": {
-            "/^transition/": ["/all/"]
-        },
-        "block-closing-brace-newline-after": null,
-        "max-empty-lines": null,
-        "selector-list-comma-newline-after": null,
-        "at-rule-empty-line-before": null,
-        "at-rule-semicolon-newline-after": null,
-        "selector-pseudo-element-colon-notation": "single",
-        "color-no-hex": true,
-        "function-url-quotes": "always",
-        "max-nesting-depth": [
-            4,
-            {
-                "ignoreAtRules": ["each", "media", "supports", "include"],
-                "severity": "warning"
-            }
-        ],
-        "number-leading-zero": null,
-        "order/order": [
-            [
-                "custom-properties",
-                "dollar-variables",
-                {
-                    "type": "at-rule",
-                    "name": "extend"
-                },
-                {
-                    "type": "at-rule",
-                    "name": "include"
-                },
-                "declarations",
-                "rules"
-            ]
-        ],
-        "order/properties-alphabetical-order": null,
-        "property-no-vendor-prefix": [
-            true,
-            {
-                "severity": "warning"
-            }
-        ],
-        "value-no-vendor-prefix": [
-            true,
-            {
-                "severity": "warning"
-            }
-        ],
-        "scss/selector-no-redundant-nesting-selector": null,
-        "selector-class-pattern": null,
-        "selector-max-compound-selectors": [
-            4,
-            {
-                "severity": "warning"
-            }
-        ],
-        "selector-no-qualifying-type": null,
-        "string-quotes": null,
-        "max-line-length": null,
-        "keyframes-name-pattern": null,
-        "scss/double-slash-comment-empty-line-before": null,
-        "scss/double-slash-comment-whitespace-inside": null,
-        "scss/dollar-variable-empty-line-before": null,
-        "scss/dollar-variable-pattern": "[a-z-]",
-        "scss/at-import-partial-extension": null,
-        "declaration-block-no-redundant-longhand-properties": null,
-        "color-function-notation": null,
-        "alpha-value-notation": null,
-        "at-rule-no-unknown": null,
-        "property-no-unknown": null,
-        "scss/at-rule-no-unknown": true,
-        "selector-pseudo-class-no-unknown": [true, { "ignorePseudoClasses": ["selected"] }],
-        "font-family-no-missing-generic-family-keyword": null,
-        "scss/no-global-function-names": null,
-        "unit-no-unknown": [true, { "ignoreUnits": ["dp"] }],
-        "selector-type-no-unknown": [true, { "ignore": ["custom-elements", "default-namespace"] }],
-        "value-keyword-case": null
-    }
-}

assets/scss/main.scss

@@ -1,2 +0,0 @@
-@import "styles/base";
-@import "styles/global";

assets/scss/package.json

@@ -1,29 +0,0 @@
-{
-  "name": "mmrecomp-ui-scss",
-  "version": "1.0.0",
-  "description": "",
-  "main": "index.js",
-  "scripts": {
-    "start": "npm run watch",
-    "watch": "sass --no-source-map --no-charset --style=compressed main.scss ..\\recomp.rcss --watch",
-    "watch:debug": "sass --no-source-map --no-charset main.scss ..\\recomp.rcss --watch",
-    "build": "sass --no-source-map --no-charset --style=compressed main.scss ..\\recomp.rcss",
-    "build:debug": "sass --no-source-map --no-charset main.scss ..\\recomp.rcss",
-    "lint": "stylelint '.\\**\\*.scss'"
-  },
-  "author": "",
-  "license": "ISC",
-  "devDependencies": {
-    "postcss-scss": "^4.0.9",
-    "stylelint": "^15.11.0",
-    "stylelint-config-property-sort-order-smacss": "^9.1.0",
-    "stylelint-config-sass-guidelines": "^10.0.0",
-    "stylelint-config-scss": "^1.0.0-security",
-    "stylelint-config-standard": "^34.0.0",
-    "stylelint-config-standard-scss": "^11.1.0",
-    "stylelint-scss": "^5.3.1"
-  },
-  "dependencies": {
-    "sass": "^1.75.0"
-  }
-}

assets/scss/styles/base.scss

@@ -1,11 +0,0 @@
-@use 'sass:math';
-@import "./functions/spacing";
-@import "./vars/spacing";
-@import "./vars/colors";
-@import "./vars/borders";
-@import "./vars/gradients";
-@import "./vars/transitions";
-@import "./vars/animations";
-@import "./mixins/typography";
-@import "./mixins/transitions";
-@import "./mixins/helpers";

assets/scss/styles/components/BottomLeft.scss

@@ -1,14 +0,0 @@
-@use 'sass:math';
-
-.bottom-left {
-    display: flex;
-    position: absolute;
-    bottom: space(4);
-    flex-direction: row;
-    align-items: flex-start;
-    justify-content: flex-start;
-    width: 100%;
-    max-width: space($base-modal-max-width);
-    height: auto;
-    margin: 0 space(4);
-}

assets/scss/styles/components/Button.scss

@@ -1,81 +0,0 @@
-@use 'sass:color';
-
-@mixin create-button-variation($base-col, $base-col-05, $base-col-20, $base-col-30, $base-col-80) {
-    border-color: $base-col-80;
-    background-color: $base-col-05;
-    color: $color-text-dim;
-
-    &:focus, &:hover {
-        border-color: $base-col;
-        background-color: $base-col-30;
-        color: $color-text;
-    }
-
-    &:disabled,&[disabled] {
-        color: $color-text-inactive;
-    }
-
-    &:active {
-        background-color: $base-col-20;
-        color: $color-text-active;
-    }
-}
-
-.button {
-    @extend %label-md;
-    @extend %nav-all;
-    @include create-button-variation($color-primary, $color-primary-a5, $color-primary-a20, $color-primary-a30, $color-primary-a80);
-    @include trans-colors;
-
-    display: block;
-    width: auto;
-    height: auto;
-    // leave 1dp room for border expansion
-    padding: space(24 - 1);
-    border-width: $border-width-thickness;
-
-    border-radius: $border-radius-md;
-
-    // Setting it by default for convenience
-    &--primary {
-        @include create-button-variation($color-primary, $color-primary-a5, $color-primary-a20, $color-primary-a30, $color-primary-a80);
-    }
-
-    &--large {
-        @extend %label-lg;
-    }
-
-    &--secondary {
-        @include create-button-variation($color-secondary, $color-secondary-a5, $color-secondary-a20, $color-secondary-a30, $color-secondary-a80);
-    }
-
-    &--tertiary {
-        @include create-button-variation($color-text, $color-text-a5, $color-text-a20, $color-text-a30, $color-text-a80);
-    }
-
-    &--success {
-        @include create-button-variation($color-success, $color-success-a5, $color-success-a20, $color-success-a30, $color-success-a80);
-    }
-
-    &--danger {
-        @include create-button-variation($color-danger, $color-danger-a5, $color-danger-a20, $color-danger-a30, $color-danger-a80);
-    }
-
-    &--warning {
-        @include create-button-variation($color-warning, $color-warning-a5, $color-warning-a20, $color-warning-a30, $color-warning-a80);
-    }
-
-    &:not([disabled]) {
-        @extend %nav-all;
-        cursor: pointer;
-    }
-
-    &:disabled,&[disabled] {
-        opacity: 0.5;
-    }
-
-    &__label {
-        width: auto;
-        height: auto;
-    }
-}

assets/scss/styles/components/CenteredPage.scss

@@ -1,73 +0,0 @@
-@use 'sass:math';
-
-.centered-page {
-    display: flex;
-    // visibility: hidden;
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    padding: space($page-margin);
-    background-color: $color-border-soft;
-}
-
-.centered-page__modal {
-    display: flex;
-    position: relative;
-    flex: 1 1 100%;
-    flex-direction: column;
-    width: 100%;
-    max-width: space($base-modal-max-width);
-    height: 100%;
-    margin: auto;
-    border-width: $border-width-thickness;
-    border-radius: $border-radius-modal;
-    border-color: $color-border;
-    background: $color-modal-overlay;
-
-    > .tabs {
-        display: flex;
-        position: relative;
-        flex: 1 1 100%;
-        flex-direction: column;
-        width: 100%;
-        max-width: space($base-modal-max-width);
-        height: 100%;
-        margin: auto;
-    }
-
-    panels {
-        flex: 1 1 100%;
-    }
-}
-
-.centered-page__controls {
-    display: flex;
-    position: absolute;
-    bottom: space(24);
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    max-width: space($base-modal-max-width);
-    height: auto;
-    margin: 0 auto;
-
-    > label {
-        @extend %label-sm;
-        display: inline-block;
-        align-items: center;
-        justify-content: space-between;
-        width: auto;
-        height: space(24);
-
-        &:not(:last-child) {
-            margin-right: space(40);
-        }
-
-        > span:first-child {
-            margin-right: space(4);
-        }
-    }
-}

assets/scss/styles/components/Config.scss

@@ -1,101 +0,0 @@
-
-.config__icon-buttons {
-    display: flex;
-    position: absolute;
-    top: space(8);
-    right: space(0);
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-end;
-    width: auto;
-
-    .icon-button {
-        margin: 0 space(8);
-    }
-}
-
-.config__form {
-    @include border-top($color-border-soft);
-    display: flex;
-    flex: 1 1 100%;
-    flex-direction: column;
-    justify-content: space-between;
-    width: 100%;
-    height: 100%;
-    border-bottom-right-radius: $border-radius-modal;
-    border-bottom-left-radius: $border-radius-modal;
-}
-
-.config__wrapper {
-    flex: 1 1 100%;
-    width: auto;
-    height: auto;
-    padding: space(16);
-    border-radius: 0dp;
-    border-bottom-right-radius: $border-radius-modal;
-    border-bottom-left-radius: $border-radius-modal;
-    background-color: $color-bg-shadow;
-    text-align: left;
-
-    p {
-        @extend %body;
-        padding: space(16);
-        line-height: space(28);
-        white-space: pre-line;
-
-        b {
-            color: $color-primary;
-        }
-
-        i {
-            color: $color-warning;
-            font-style: normal;
-        }
-    }
-}
-
-.config__hz-wrapper {
-    display: flex;
-    flex: 1 1 100%;
-    flex-direction: row;
-    width: 100%;
-    height: 100%;
-    border-radius: 0dp;
-    text-align: left;
-}
-
-.config__header, .config__footer {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    width: 100%;
-    background-color: $color-bg-shadow;
-}
-
-.config__header {
-    @include border-bottom($color-border-soft);
-    padding: space(12) space(20);
-}
-
-.config__footer {
-    @include border-top($color-border-soft);
-    padding: space(20) space(20);
-    border-bottom-right-radius: $border-radius-modal;
-    border-bottom-left-radius: $border-radius-modal;
-}
-
-.config__header-left {
-    display: flex;
-    flex: 1 1 auto;
-    flex-direction: row;
-
-    > :not(:first-child) {
-        margin-left: space(8);
-    }
-}
-
-.config__row {
-    display: flex;
-    flex-direction: row;
-}
-

assets/scss/styles/components/ConfigDescription.scss

@@ -1,27 +0,0 @@
-.config-description {
-    flex: 1 1 100%;
-    width: auto;
-    height: auto;
-    padding: space(16);
-    border-radius: 0dp;
-    border-bottom-right-radius: $border-radius-modal;
-    border-bottom-left-radius: $border-radius-modal;
-    background-color: $color-bg-shadow;
-    text-align: left;
-
-    &__contents {
-        @extend %body;
-        padding: space(16);
-        line-height: space(28);
-        white-space: pre-line;
-
-        b {
-            color: $color-primary;
-        }
-
-        i {
-            color: $color-warning;
-            font-style: normal;
-        }
-    }
-}

assets/scss/styles/components/ConfigGroup.scss

@@ -1,29 +0,0 @@
-
-.config-group {
-    position: relative;
-
-    &--scrollable {
-        flex: 1 1 100%;
-        width: auto;
-        height: auto;
-        padding: 0 0 0 space(16);
-        
-        .config-group__wrapper {
-            max-height: 100%;
-            overflow-y: auto;
-        }
-    }
-
-    &__title {
-        @extend %label-md;
-        color: $color-primary;
-
-        &--hidden {
-            display: none;
-        }
-    }
-    
-    &__wrapper {
-        padding: space(16) 0;
-    }
-}

assets/scss/styles/components/ConfigOption.scss

@@ -1,413 +0,0 @@
-.config-option {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    align-items: flex-start;
-    justify-content: flex-start;
-    margin: space(16) space(0) space(24);
-
-    &--hz {
-        flex-direction: row-reverse;
-        align-items: center;
-        margin-top: space(4);
-        margin-bottom: space(4);
-
-        .config-option__title {
-            @extend %label-md;
-            flex: 1 1 100%;
-        }
-
-        .config-option__list {
-            flex: 1 1 auto;
-            width: auto;
-        }
-
-        &:first-child {
-            margin-top: 0;
-        }
-
-        &:last-child {
-            margin-bottom: 0;
-        }
-    }
-}
-
-.config-option__title {
-    @extend %label-md;
-    padding: 0 space(12);
-}
-
-.config-option__radio-tabs,
-.config-option__list {
-    display: flex;
-    flex-direction: row;
-    align-items: flex-start;
-    justify-content: flex-start;
-    width: 100%;
-    height: auto;
-    padding: 0;
-
-    input:first-of-type {
-        nav-left: none;
-    }
-
-    input:last-of-type {
-        nav-right: none;
-    }
-
-    .config-option__tab-label {
-        @extend %label-sm;
-        @include trans-colors-opa;
-        display: block;
-        position: relative;
-        height: auto;
-        margin: space(4) space(12) 0;
-        padding: space(8) 0;
-        color: $color-text-inactive;
-        tab-index: none;
-
-        &:hover {
-            color: $color-text;
-            cursor: pointer;
-        }
-    }
-
-    .config-option__checkbox-wrapper {
-        @include trans-colors-opa;
-        width: space(32);
-        height: space(32);
-        margin: space(4) space(12) 0;
-        border-radius: $border-radius-sm;
-        opacity: 0.5;
-        background-color: $color-bg-overlay;
-        cursor: pointer;
-
-        &:hover {
-            opacity: 1;
-        }
-        
-        &[checked] {
-            background-color: $color-a;
-        }
-    }
-
-    .config-option__checkbox {
-        @extend %nav-all;
-        @include trans-colors-opa;
-        visibility: visible;
-        width: 0;
-        height: 0;
-    }
-
-    // TODO: Remove & Replace old stylings
-    input.radio {
-        @extend %nav-all;
-        @include trans-colors-opa;
-        visibility: visible;
-        width: 0;
-        height: 0;
-
-        &:not(:disabled) {
-            &:checked + .config-option__tab-label {
-                border-bottom: 1dp;
-                border-color: $color-text;
-                color: $color-text;
-    
-                &:hover {
-                    cursor: default;
-                }
-            }
-    
-            .rmlui-window:not([mouse-active]) &:focus + .config-option__tab-label {
-                transition: none;
-                animation: $focus-anim-border;
-                border-color: $color-secondary;
-                color: $color-secondary;
-            }
-
-            &:focus + .config-option__tab-label,
-            &:hover + .config-option__tab-label {
-                color: $color-text;
-            }
-        }
-
-        &:disabled + .config-option__tab-label {
-            opacity: 0.5;
-
-            &:hover {
-                cursor: default;
-            }
-        }
-    }
-
-    input.range slidertrack {
-        @include trans-colors;
-        height: 2dp;
-        margin-top: space(8);
-        background-color: $color-border;
-    }
-    
-    input.range sliderbar {
-        @include trans-colors;
-        width: space(16);
-        height: space(16);
-        margin-top: space(1);
-        margin-right: space(-8);
-        margin-left: space(-8);
-        transition: background-color $transition-quick;
-        border-radius: 8dp;
-        background-color: $color-text-dim;
-        
-        .rmlui-window:not([mouse-active]) &:focus {
-            @include border($color-a);
-            animation: $focus-anim-bg;
-        }
-
-        &:hover {
-            background-color: $color-text;
-            cursor: pointer;
-        }
-    }
-    
-    input.range sliderbar:active,
-    input.range slidertrack:active + sliderbar {
-        background-color: $color-secondary;
-    }
-
-    input.range sliderarrowdec,
-    input.range sliderarrowinc {
-        display: none;
-    }
-}
-
-.config-option__details {
-    @extend %label-xs;
-    height: space(18);
-    margin: space(14) space(12) 0;
-    color: $color-primary;
-}
-
-.config-option-color {
-    width: 100%;
-    max-width: space(360);
-    height: auto;
-    margin-top: space(4);
-    margin-left: space(12);
-    padding: 0;
-
-    &__preview-wrapper {
-        display: flex;
-        flex-direction: row;
-        width: 100%;
-        height: space(8 * 9);
-    }
-
-    &__preview-block {
-        display: block;
-        width:  space(8 * 11);
-        height: 100%;
-        border-width: $border-width-thickness;
-        border-radius: $border-radius-lg;
-        border-color: $color-border;
-    }
-
-    &__hsv-wrapper {
-        display: flex;
-        flex: 1 1 100%;
-        flex-direction: column;
-        width: auto;
-        height: auto;
-        padding-left: space(8);
-
-        .config-option-range {
-            flex: 1 1 auto;
-
-            label {
-                min-width: space(72);
-            }
-
-            input {
-                flex: 1 1 auto;
-            }
-        }
-    }
-}
-
-.config-option-range {
-    display: flex;
-    flex-direction: row;
-    align-items: flex-start;
-    justify-content: flex-start;
-    width: 100%;
-    max-width: space(360);
-    height: auto;
-    margin-top: space(4);
-    padding: 0;
-
-    &__label {
-        @extend %label-sm;
-
-        display: block;
-        width: space(56);
-        margin: 0 12dp;
-        margin-right: space(16);
-        padding: 0;
-        color: $color-text;
-        tab-index: none;
-    }
-
-    &__range-input {
-        flex: 1;
-
-        slidertrack {
-            @include trans-colors;
-            height: 2dp;
-            margin-top: space(8);
-            background-color: $color-border;
-        }
-        
-        sliderbar {
-            @include trans-colors;
-            width: space(16);
-            height: space(16);
-            margin-top: space(1);
-            margin-right: space(-8);
-            margin-left: space(-8);
-            transition: background-color $transition-quick;
-            border-radius: 8dp;
-            background-color: $color-text-dim;
-            
-            .rmlui-window:not([mouse-active]) &:focus {
-                @include border($color-a);
-                animation: $focus-anim-bg;
-            }
-
-            &:hover {
-                background-color: $color-text;
-                cursor: pointer;
-            }
-        }
-        
-        sliderbar:active,
-        slidertrack:active + sliderbar {
-            background-color: $color-secondary;
-        }
-
-        sliderarrowdec,
-        sliderarrowinc {
-            display: none;
-        }
-    }
-
-}
-
-.config-option__range-wrapper {
-    max-width: space(360);
-    margin-top: space(4);
-}
-
-.config-option__range-label {
-    @extend %label-sm;
-
-    display: block;
-    // flex: 0 0 space(32);
-    width: space(56);
-    margin: 0 12dp;
-    margin-right: space(16);
-    padding: 0;
-    color: $color-text;
-    tab-index: none;
-}
-
-.config-option-dropdown, .config-option-textfield {
-    display: flex;
-    position: relative;
-    flex: 1 1 100%;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
-    width: auto;
-    height: auto;
-    padding: space(8) space(24) space(8) space(12);
-
-    &__select {
-        display: block;
-        height: space(48);
-        padding: space(14);
-        cursor: pointer;
-    }
-
-    &__wrapper {
-        // Cursed guess & check so that this appears to be the same height as the select
-        $extra-space: 2;
-
-        display: flex;
-        align-items: center;
-        justify-content: flex-start;
-        width: 100%;
-        height: auto;
-        padding: space(0 + $extra-space) 0 space(10 + $extra-space);
-        cursor: text;
-
-        input {
-            width: 100%;
-            height: auto;
-            vertical-align: middle;
-        }
-    }
-
-    &__select, &__wrapper {
-        @extend %body;
-        @extend %nav-all;
-        @include trans-colors-border;
-        @include border($color-white-a50);
-        position: relative;
-        box-sizing: border-box;
-        flex: 1 1 100%;
-
-        width: auto;
-        border-radius: $border-radius-md;
-        background-color: $color-white-a5;
-
-        &:hover, &:focus {
-            @include border($color-white-a80);
-            background-color: $color-white-a20;
-        }
-
-        selectvalue {
-            display: inline;
-            height: auto;
-            margin: auto 0;
-        }
-
-        selectbox {
-            @include border($color-border);
-            margin-top: space(2);
-            padding: space(4) 0;
-            border-radius: $border-radius-md;
-            background-color: $color-background-3;
-            
-            option {
-                @extend %nav-all;
-                @include trans-colors;
-                padding: space(8) space(12);
-                background-color: $color-transparent;
-                color: $color-text-dim;
-                font-weight: 400;
-
-                &:hover, &:focus {
-                    background-color: $color-white-a20;
-                }
-
-                &:hover:not(:checked) {
-                    cursor: pointer;
-                }
-
-                &:checked {
-                    background-color: $color-white-a5;
-                    color: $color-white;
-                }
-            }
-        }
-    }
-}

assets/scss/styles/components/ControlOption.scss

@@ -1,170 +0,0 @@
-@use 'sass:color';
-@use 'sass:math';
-
-.control-option {
-    @include set-color($color-text-dim);
-    @include trans-colors-svg;
-    display: flex;
-    position: relative;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-    width: 100%;
-    height: auto;
-    padding: space(4) space(16) space(4) space(20);
-    border-radius: $border-radius-sm;
-    background-color: rgba(0, 0, 0, 0);
-
-    &:focus-visible:not(:disabled, [disabled]),
-    &:hover:not(:disabled, [disabled]) {
-        @include set-color($color-text);
-        background-color: $color-bg-overlay;
-    }
-
-    &:disabled, &[disabled] {
-        opacity: 0.5;
-    }
-
-    &--active {
-        // while actively looking for inputs, set styles to the correct slots
-        $valid-binding-slots: 0, 1;
-        @each $slot in $valid-binding-slots {
-            // global attr -> this active row -> binding slot
-            [cur-binding-slot="#{$slot}"] & .control-option__binding[bind-slot="#{$slot}"] {
-                border-color: $color-danger;
-
-                .control-option__binding-icon {
-                    opacity: 0;
-                }
-
-                .control-option__binding-recording {
-                    opacity: 1;
-                }
-            }
-        }
-    }
-
-    .icon-button {
-        flex: 1 1 auto;
-    }
-}
-
-.control-option__label {
-    @extend %label-md;
-    flex: 2 1 space(300);
-    height: auto;
-    white-space: nowrap;
-}
-
-.control-option__bindings {
-    display: flex;
-    position: relative;
-    flex: 2 1 space(400);
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-    width: 100%;
-    height: space(56);
-    padding: 0 space(12) 0 space(4);
-}
-
-.control-option__binding {
-    @include set-color($color-text-dim);
-    @include trans-colors-border;
-    display: flex;
-    position: relative;
-
-    flex: 1 1 100%;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    height: space(56);
-    margin: 0 space(4);
-    padding: space(8);
-    border-width: $border-width-thickness;
-    border-radius: $border-radius-sm;
-    border-color: $color-bg-overlay;
-    background-color: $color-bg-overlay;
-
-    &:focus, &:hover {
-        @include set-color($color-text);
-        border-color: $color-text;
-        background-color: $color-border-soft;
-    }
-
-    &:active {
-        @include set-color($color-text-active);
-    }
-
-    &:disabled, &[disabled] {
-        @include set-color($color-text-dim);
-        opacity: 0.5;
-    }
-
-    &:not([disabled]) {
-        @extend %nav-all;
-        cursor: pointer;
-    }
-}
-
-.control-option__binding-icon {
-    @include trans-colors-opa;
-    opacity: 1;
-}
-
-@keyframes control-option__binding-recording-scale {
-	0% {
-		transform: scale(1);
-	}
-
-	50% {
-		transform: scale(0.85);
-	}
-
-	100% { 
-		transform: scale(1);
-	}
-}
-
-.control-option__binding-recording {
-    @include trans-colors-opa;
-    display: flex;
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    align-items: center;
-    justify-content: center;
-    opacity: 0;
-
-    .control-option__binding-circle {
-        $rec-size: 24;
-
-        width: space($rec-size);
-        height: space($rec-size);
-        animation: 1.5s sine-in-out infinite control-option__binding-recording-scale;
-        border-radius: space($rec-size);
-        background-color: $color-danger;
-    }
-
-    .control-option__binding-edge {
-        $edge-size: 36;
-        $h-edge-size: math.div($edge-size, 2);
-
-        position: absolute;
-
-        top: 50%;
-        left: 50%;
-        width: space($edge-size);
-        height: space($edge-size);
-
-        transform: translate(-50%, -50%);
-        
-        > svg.control-option__binding-edge-svg {
-            width: space($edge-size);
-            height: space($edge-size);
-            image-color: $color-danger;
-        }
-    }
-}

assets/scss/styles/components/IconButton.scss

@@ -1,92 +0,0 @@
-@use 'sass:color';
-
-/*
-    <button
-        class="icon-button icon-button--danger"
-    >
-        <svg src="icons/Trash.svg" />
-    </button>
-*/
-@mixin create-icon-button-variation($base-col, $base-col-05, $base-col-20, $base-col-30, $base-col-80) {
-    border-color: $base-col-80;
-    background-color: $base-col-05;
-
-    &:focus, &:hover {
-        border-color: $base-col;
-        background-color: $base-col-30;
-    }
-
-    &:active {
-        background-color: $base-col-20;
-    }
-}
-
-$icon-button-size: 56 - ($border-width-thickness-num * 2);
-
-.icon-button {
-    @include set-color($color-text-dim);
-    @include trans-colors-border;
-
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: space($icon-button-size);
-    min-width: space($icon-button-size);
-    max-width: space($icon-button-size);
-    height: space($icon-button-size);
-    min-height: space($icon-button-size);
-    max-height: space($icon-button-size);
-    border-width: $border-width-thickness;
-    border-radius: space($icon-button-size * 0.5);
-    border-color: $color-transparent;
-    background-color: $color-transparent;
-
-    &:focus, &:hover {
-        @include set-color($color-text);
-        background-color: $color-border;
-    }
-
-    &:active {
-        @include set-color($color-text-active);
-        background-color: $color-border-soft;
-    }
-
-    &:disabled,&[disabled] {
-        @include set-color($color-text-dim);
-        opacity: 0.5;
-    }
-
-    &:not([disabled]) {
-        @extend %nav-all;
-        cursor: pointer;
-    }
-
-    svg {
-        width: space(32);
-        height: space(32);
-    }
-
-    &--primary {
-        @include create-icon-button-variation($color-primary, $color-primary-a5, $color-primary-a20, $color-primary-a30, $color-primary-a80);
-    }
-
-    &--secondary {
-        @include create-icon-button-variation($color-secondary, $color-secondary-a5, $color-secondary-a20, $color-secondary-a30, $color-secondary-a80);
-    }
-
-    &--tertiary {
-        @include create-icon-button-variation($color-text, $color-text-a5, $color-text-a20, $color-text-a30, $color-text-a80);
-    }
-
-    &--success {
-        @include create-icon-button-variation($color-success, $color-success-a5, $color-success-a20, $color-success-a30, $color-success-a80);
-    }
-
-    &--danger {
-        @include create-icon-button-variation($color-danger, $color-danger-a5, $color-danger-a20, $color-danger-a30, $color-danger-a80);
-    }
-
-    &--warning {
-        @include create-icon-button-variation($color-warning, $color-warning-a5, $color-warning-a20, $color-warning-a30, $color-warning-a80);
-    }
-}

assets/scss/styles/components/InputConfig.scss

@@ -1,347 +0,0 @@
-@use 'sass:math';
-
-// Probably will need to adjust for other langs...
-$mapping-min-width: 80 * 8;
-$visual-max-width: $base-modal-max-width - $mapping-min-width - $scrollbar-width;
-
-.input-config {
-    padding: 0;
-}
-
-.input-config__horizontal-split {
-    display: flex;
-    position: relative;
-    flex-direction: row;
-    height: 100%;
-}
-
-.input-config__mappings {
-    display: block;
-    flex: 1 1 auto;
-    min-width: space($mapping-min-width);
-    height: 100%;
-}
-
-.input-config__mappings-scroll {
-    display: block;
-    width: 100%;
-    max-height: 100%;
-    overflow-y: auto;
-}
-
-.input-config__mappings-wrapper {
-    padding: space(8);
-}
-
-.input-config__visual-wrapper {
-    display: block;
-    flex: 1 1 100%;
-    width: auto;
-    max-width: space($visual-max-width);
-    height: auto;
-    max-height: space(math.div($visual-max-width, 4) * 3);
-    margin: auto 0;
-}
-
-.input-config__visual-aspect {
-    position: relative;
-    width: 100%;
-    margin: auto 0;
-    padding-bottom: 75%;
-    background-color: $color-bg-shadow;
-}
-
-.input-config__visual {
-    display: flex;
-    position: absolute;
-    top: space(16);
-    right: space(16);
-    bottom: space(16);
-    left: space(16);
-    flex-direction: column;
-    border-radius: space(108);
-    background-color: $color-white-a5;
-}
-
-.input-config__visual-half {
-    display: flex;
-    position: relative;
-    flex: 1 1 100%;
-    flex-direction: row;
-    padding: 6%;
-
-    &--bottom {
-        align-items: flex-end;
-        justify-content: space-between;
-    }
-}
-
-.input-config__visual-quarter-left {
-    display: flex;
-    flex: 1 1 50%;
-    align-items: flex-start;
-    justify-content: flex-start;
-    width: auto;
-}
-
-.input-config__visual-quarter-right {
-    display: flex;
-    flex: 1 1 100%;
-    align-items: flex-start;
-    justify-content: flex-end;
-}
-
-.input-config__visual-stick-wrapper {
-    display: flex;
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    align-items: center;
-    justify-content: center;
-}
-
-.input-viz {
-    @include trans-colors-opa;
-    display: flex;
-    position: relative;
-    align-items: center;
-    justify-content: center;
-
-    > svg:not(.input-viz__dpad-arrow) {
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-    }
-
-    &__mappings div {
-        @extend %prompt-font-sm;
-    }
-}
-
-$all-inputs: A,
-    B,
-    Z,
-    START,
-    DPAD_UP,
-    DPAD_DOWN,
-    DPAD_LEFT,
-    DPAD_RIGHT,
-    L,
-    R,
-    C_UP,
-    C_DOWN,
-    C_LEFT,
-    C_RIGHT,
-    X_AXIS_NEG,
-    X_AXIS_POS,
-    Y_AXIS_NEG,
-    Y_AXIS_POS;
-
-// Show default state while no inputs are active
-[cur-input="NONE"] .input-viz[visual-input] {
-    opacity: 1;
-}
-
-@each $inp in $all-inputs {
-    .input-viz[visual-input~="#{$inp}"] {
-        opacity: 0.25;
-
-        [cur-input="#{$inp}"] & {
-            opacity: 1.0;
-        }
-    }
-}
-
-@mixin set-sizes($sz) {
-    width: space($sz);
-    height: space($sz);
-    
-    > svg {
-        width: space($sz);
-        height: space($sz);
-    }
-}
-
-.input-viz__button {
-    @include set-color($color-text);
-
-    &--sm {
-        @include set-sizes(64);
-    }
-
-    &--md {
-        @include set-sizes(76);
-    }
-
-    &--lg {
-        @include set-sizes(84);
-    }
-
-    &--C {
-        @include set-svgs-color($color-warning);
-    }
-
-    &--A {
-        @include set-svgs-color($color-a);
-        margin-top: auto;
-    }
-
-    &--B {
-        @include set-svgs-color($color-success);
-    }
-
-    &--Start {
-        @include set-svgs-color($color-danger);
-    }
-}
-
-.input-viz__Z {
-    @include set-svgs-color($color-warning);
-    @include set-sizes(136);
-}
-
-$dpad-size: 192;
-
-.input-viz.input-viz__dpad {
-    @include set-svgs-color($color-text);
-    @include set-sizes($dpad-size);
-    position: relative;
-}
-
-$stick-size: 200;
-
-.input-config__visual-stick {
-    display: flex;
-    position: relative;
-    align-items: center;
-    justify-content: center;
-    width: space($stick-size);
-    height: space($stick-size);
-    border-radius: space(math.div($stick-size, 2));
-    background-color: $color-white-a5;
-}
-
-.input-viz__dpad-split,
-.input-viz__stick-split {
-    @include inset-block(0);
-    display: flex;
-    width: 100%;
-    height: 100%;
-
-    &--vertical {
-        flex-direction: column;
-        align-items: center;
-        justify-content: space-between;
-    }
-
-    &--horizontal {
-        flex-direction: row;
-        align-items: center;
-        justify-content: space-between;
-    }
-
-    > div {
-        display: flex;
-        flex: 1 1 100%;
-        flex-direction: row;
-        align-items: center;
-        justify-content: center;
-    }
-}
-
-.input-viz__dpad-split > div {
-    width: space(math.div($dpad-size, 3));
-    height: space(math.div($dpad-size, 3));
-}
-
-.input-viz__stick-split > div {
-    width: space(math.div($stick-size, 3));
-    height: space(math.div($stick-size, 3));
-}
-
-.input-viz__dpad-arrow {
-    $edge-dist: space(4);
-    position: absolute;
-    width: space(60);
-    height: space(60);
-
-    &--up {
-        top: $edge-dist;
-        margin: 0 auto;
-    }
-
-    &--down {
-        bottom: $edge-dist;
-        margin: 0 auto;
-        transform: rotate(180deg);
-    }
-
-    &--left {
-        left: $edge-dist;
-        margin: auto 0;
-        transform: rotate(-90deg);
-    }
-
-    &--right {
-        right: $edge-dist;
-        margin: auto 0;
-        transform: rotate(90deg);
-    }
-}
-
-.input-viz__R {
-    @include set-svgs-color($color-white);
-    @include set-sizes(96);
-}
-
-.input-viz__L {
-    @include set-svgs-color($color-secondary);
-    @include set-sizes(136);
-}
-
-.input-config__c-buttons {
-    position: relative;
-    width: space(76 + 76 + 56);
-    height: space(76 + 56);
-
-    &-lr, &-du {
-        display: flex;
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-    }
-
-    &-lr {
-        flex-direction: row;
-        align-items: flex-start;
-        justify-content: space-between;
-    }
-
-    &-du {
-        flex-direction: column-reverse;
-        align-items: center;
-        justify-content: space-between;
-    }
-
-    .input-viz {
-        &[visual-input="C_UP"] {
-            margin-top: space(-32);
-        }
-    }
-}
-
-.input-config__main-buttons {
-    display: flex;
-    position: relative;
-    flex-direction: row;
-    justify-content: space-between;
-    width: space(268);
-    height: space(128);
-    margin-right: space(10);
-}

assets/scss/styles/components/Launcher.scss

@@ -1,108 +0,0 @@
-
-// TODO: Affect all elements with launcher fade-in
-// @keyframes fade-launcher-in {
-// 	0% {
-// 		opacity: 0;
-// 	}
-// 	to { 
-// 		opacity: 1;
-// 	}
-// }
-
-.launcher {
-    display: block;
-    position: relative;
-    flex-direction: row;
-    justify-content: space-between;
-    width: 100%;
-    height: 100%;
-    background-color: $color-background-1;
-}
-
-.launcher__vertical-split {
-    display: flex;
-    position: absolute;
-    top: 0;
-    right: 50%;
-    bottom: 0;
-    left: 0;
-    flex-direction: column;
-    align-items: flex-start;
-    justify-content: space-between;
-
-    &--right {
-        right: 0;
-        left: 50%;
-        align-items: flex-end;  
-    }
-}
-
-
-@keyframes slide-mm-bg-over {
-	0% {
-		transform: translateX(space(100));
-	}
-
-	100% { 
-		transform: translateX(space(0));
-	}
-}
-
-.launcher__background-wrapper {
-    display: flex;
-    position: absolute;
-    top: -55vw;
-    right: -100%;
-    bottom: -50vw;
-    left: -70vw;
-    align-items: center;
-    justify-content: flex-start;
-    transform: translateX(space(0));
-    animation: 25s cubic-out 1 slide-mm-bg-over;
-}
-
-@keyframes fade-mm-in {
-	0% {
-		opacity: 0;
-	}
-
-	100% { 
-		opacity: 0.1;
-	}
-}
-
-.launcher__background-bk {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    width: auto;
-    height: 100%;
-    animation: 2.5s cubic-in-out 1 fade-mm-in;
-    opacity: 0.1;
-}
-
-.launcher__title-quadrant {
-    flex: 1 1 auto;
-    width: auto;
-    height: auto;
-    padding-top: space(96);
-    padding-left: space(96);
-
-    &--right {
-        padding-right: space(96);
-        padding-left: 0;
-    }
-}
-
-.launcher__content-quadrant {
-    display: flex;
-    position: relative;
-    flex: 1 1 100%;
-    flex-direction: column;
-    align-items: flex-start;
-    justify-content: flex-end;
-    width: 100%;
-    height: auto;
-    padding: space(32);
-}

assets/scss/styles/components/MenuListItem.scss

@@ -1,73 +0,0 @@
-
-/*
-    Example layout:
-        <button class="menu-list-item menu-list-item--right">
-            <div class="menu-list-item__bullet">•</div>
-            <div class="menu-list-item__label">Setup controls</div>
-        </button>
-    - Variants:
-        .menu-list-item--right (align to right side)
-    - Optional:
-        - <div class="subtitle-title__disclaimer">Coming Soon™</div>
-
-*/
-
-.menu-list-item {
-    @include set-color($color-text-dim);
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    width: 100%;
-    height: auto;
-    padding: space(16);
-    border-radius: $border-radius-sm;
-    background-color: rgba(0, 0, 0, 0);
-    cursor: pointer;
-
-    &--right {
-        flex-direction: row-reverse;
-        align-content: flex-end;
-
-        .menu-list-item__bullet {
-            margin-left: space(12);
-            opacity: 1;
-        }
-
-        &.menu-list-item:focus:not(:disabled, [disabled]),
-        &.menu-list-item:hover:not(:disabled, [disabled]) {
-            // decorator: $primary-rl-fade;
-            background-color: $color-white-a5;
-        }
-    }
-
-    &:focus:not(:disabled, [disabled]),
-    &:hover:not(:disabled, [disabled]) {
-        @include set-color($color-primary);
-        // decorator: $primary-lr-fade;
-        background-color: $color-white-a5;
-
-        .menu-list-item__bullet {
-            opacity: 1;
-        }
-    }
-
-    &:not(:disabled, [disabled]) {
-        @extend %nav-all;
-    }
-
-    &:disabled, &[disabled] {
-        opacity: 0.5;
-        tab-index: none;
-        cursor: default;
-    }
-
-}
-
-.menu-list-item__label {
-    @extend %label-lg;
-}
-
-.menu-list-item__bullet {
-    margin-right: space(12);
-    opacity: 0;
-}

assets/scss/styles/components/Prompt.scss

@@ -1,70 +0,0 @@
-@use 'sass:math';
-
-$prompt-space: 24;
-
-.prompt {
-    &__overlay {
-        background-color: $color-bg-overlay;
-        pointer-events: auto;
-    }
-
-    &__overlay,
-    &__content-wrapper {
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-    }
-
-    &__content-wrapper {
-        display: flex;
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-        align-items: center;
-        justify-content: center;
-    }
-    
-    &__content {
-        display: flex;
-        position: relative;
-        flex: 1 1 100%;
-        flex-direction: column;
-        width: 100%;
-        max-width: space(700);
-        height: auto;
-        margin: auto;
-        border-width: $border-width-thickness;
-        border-radius: $border-radius-modal;
-        border-color: $color-border;
-        background: $color-modal-overlay;
-
-        h3, p {
-            margin: space($prompt-space);
-        }
-
-        p {
-            margin-top: 0;
-        }
-    }
-
-    &__controls {
-        display: flex;
-        flex-direction: row;
-        justify-content: center;
-        padding: space($prompt-space) space(math.div($prompt-space, 2));
-        border-top-width: $border-width-thickness;
-        border-top-color: $color-border-soft;
-
-        .button {
-            min-width: space(math.div(700, 3));
-            margin: 0 space(math.div($prompt-space, 2));
-            text-align: center;
-            nav-up: none;
-            nav-down: none;
-        }
-    }
-}

assets/scss/styles/components/SubtitleTitle.scss

@@ -1,71 +0,0 @@
-/*
-    Example layout:
-
-        <button class="subtitle-title" disabled>
-            <h3>Zelda 64: Recompiled</h3>
-            <h1>Ocarina of Time</h1>
-            <div class="subtitle-title__disclaimer">Coming Soon™</div>
-        </button>
-    - Variants:
-        .subtitle-title--right (align to right side)
-    - Optional:
-        - <div class="subtitle-title__disclaimer">Coming Soon™</div>
-
-*/
-
-.subtitle-title {
-    display: block;
-    position: relative;
-    flex-direction: column;
-    align-content: flex-start;
-    align-items: flex-start;
-    width: auto;
-    height: auto;
-    padding: 0;
-    background-color: rgba(0, 0, 0, 0);
-    color: $color-text-dim;
-    text-align: left;
-    cursor: pointer;
-
-    &--right {
-        align-content: flex-end;
-    }
-
-    &--right, &--right > * {
-        text-align: right;
-    }
-
-    &[selected] {
-        color: $color-text;
-        cursor: default;
-    }
-    
-    &:focus:not(:disabled, [disabled]),
-    &:hover:not(:disabled, [disabled], [selected]) {
-        color: $color-primary;
-    }
-
-    &:not(:disabled, [disabled]) {
-        @extend %nav-all;
-    }
-
-    &:disabled, &[disabled] {
-        opacity: 0.5;
-        cursor: default;
-        tab-index: none;
-    }
-
-    h3 {
-        margin-bottom: space(6);
-    }
-
-    h1 {
-        margin-top: space(6);
-    }
-
-    &__disclaimer {
-        @extend %label-sm;
-
-        margin-top: space(16);
-    }
-}

assets/scss/styles/components/Tabs.scss

@@ -1,63 +0,0 @@
-/*
-    Example:
-        <tab class="tab">
-            <div>Graphics</div>
-            <div class="tab__indicator"></div>
-        </tab>
-*/
-
-.tabs tabs {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
-}
-
-.tab {
-    @extend %nav-all;
-    @extend %header-3;
-    display: block;
-    position: relative;
-    margin: 0;
-    padding: space(20) space(24);
-    transition: color $transition-quick;
-    opacity: 0.9;
-    background-color: rgba(0,0,0,0);
-    color: $color-text-inactive;
-
-    &:selected {
-        color: $color-text;
-
-        .tab__indicator {
-            background-color: $color-border-solid;
-        }
-
-        &:hover {
-            cursor: default;
-        }
-    }
-
-    .rmlui-window:not([mouse-active]) &:focus {
-        transition: none;
-        animation: $focus-anim-border;
-
-        &:selected .tab__indicator {
-            animation: $focus-anim-bg;
-        }
-    }
-
-    &:focus, &:hover {
-        opacity: 1;
-        color: $color-text;
-        cursor: pointer;
-    }
-}
-
-.tab__indicator {
-    position: absolute;
-    right: 0;
-    bottom: 2dp;
-    left: 0;
-    height: 2dp;
-    background-color: rgba(0, 0, 0, 0);
-}

assets/scss/styles/components/Toggle.scss

@@ -1,97 +0,0 @@
-@use "sass:math";
-
-$toggle-width: 162;
-$toggle-height: 72;
-
-$toggle-floater-width: 80;
-$toggle-floater-height: 64;
-$toggle-floater-margin: 4;
-$toggle-checked-left-offset: $toggle-width - $toggle-floater-margin - $toggle-floater-width;
-
-.toggle {
-    @extend %nav-all;
-    @include trans-colors-opa;
-    display: flex;
-    position: relative;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-    width: space($toggle-width);
-    height: space($toggle-height);
-    border-radius: space(math.div($toggle-height, 2));
-    opacity: 0.9;
-    background: $color-transparent;
-    cursor: pointer;
-
-    &:hover, &:focus-visible, &:focus {
-        opacity: 1;
-        background-color: $color-secondary-a30;
-    }
-
-    &:active {
-        opacity: 1;
-        background-color: $color-secondary-a5;
-    }
-
-    .toggle__border {
-        @include inner-border-block($color-secondary-l);
-        border-radius: space(math.div($toggle-height, 2));
-    }
-
-    .toggle__floater {
-        position: absolute;
-        top: 50%;
-        left: space($toggle-floater-margin);
-        width: space($toggle-floater-width);
-        height: space($toggle-floater-height);
-        transform: translateY(-50%);
-        border-radius: space(math.div($toggle-floater-height, 2));
-        background: $color-secondary-d;
-    }
-    
-    &--checked {
-        .toggle__floater {
-            left: space($toggle-checked-left-offset);
-        }
-
-        .toggle__icon {
-            &.toggle__icon--left {
-                opacity: 0.9;
-                color: $color-secondary-l;
-            }
-
-            &.toggle__icon--right {
-                opacity: 1.0;
-                color: $color-text;
-            }
-        }
-    }
-}
-
-.toggle__icons {
-    display: flex;
-    position: absolute;
-    top: 50%;
-    right: space(16);
-    left: space(16);
-    align-items: center;
-    justify-content: space-between;
-    height: space(56);
-    transform: translateY(-50%);
-}
-
-.toggle__icon {
-    @extend %prompt-font-lg;
-    @include trans-colors;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: space(56);
-    height: space(56);
-    color: $color-text;
-
-    &--right {
-        opacity: 1;
-        color: $color-secondary-l;
-    }
-}

assets/scss/styles/components/_components.scss

@@ -1,16 +0,0 @@
-@import "./CenteredPage";
-@import "./ControlOption";
-@import "./Tabs";
-@import "./Config";
-@import "./ConfigGroup";
-@import "./ConfigOption";
-@import "./ConfigDescription";
-@import "./InputConfig";
-@import "./Button";
-@import "./IconButton";
-@import "./Launcher";
-@import "./MenuListItem";
-@import "./SubtitleTitle";
-@import "./Toggle";
-@import "./BottomLeft";
-@import "./Prompt";

assets/scss/styles/functions/_spacing.scss

@@ -1,4 +0,0 @@
-
-@function space($amt) {
-    @return #{$amt}dp;
-}

assets/scss/styles/global.scss

@@ -1,134 +0,0 @@
-@import "./base";
-
-body
-{
-    @extend %body;
-    box-sizing: border-box;
-	color: $color-text;
-	font-family: $font-stack;
-}
-
-@import "./globals/old";
-@import "./globals/scrollbars";
-@import "./components/components";
-@import "./pages/pages";
-
-$font-size: 20dp;
-
-
-.rmlui-window {
-    opacity: 1;
-
-    &--hidden {
-        opacity: 0;
-    }
-
-    &:not([mouse-active]) {
-        pointer-events: none;
-    }
-}
-
-.nav-vert {
-    @extend %nav-vert;
-}
-
-.nav-horiz {
-    @extend %nav-horiz;
-}
-
-.nav-dir {
-    @extend %nav-dir;
-}
-
-.nav-foc {
-    @extend %nav-foc;
-}
-
-.nav-all {
-    @extend %nav-all;
-}
-
-*, *:before, *:after {
-    box-sizing: border-box;
-}
-
-h1 {
-    @extend %header-1;
-}
-
-h2 {
-    @extend %header-2;
-}
-
-h3 {
-    @extend %header-3;
-}
-
-.label-lg {
-    @extend %label-lg;
-}
-
-.label-md {
-    @extend %label-md;
-}
-
-.label-sm {
-    @extend %label-sm;
-}
-
-.prompt-font {
-    @extend %prompt-font;
-}
-
-.prompt-font-sm {
-    @extend %prompt-font-sm;
-}
-
-button {
-    background-color: $color-primary-d;
-}
-
-@keyframes blue-pulse {
-	0% {
-		color: $color-secondary;
-	}
-
-	50% {
-		color: $color-secondary-l;
-	}
-
-	100% { 
-		color: $color-secondary;
-	}
-}
-
-@keyframes blue-pulse-with-border {
-	0% {
-		border-color: $color-secondary;
-		color: $color-secondary;
-	}
-
-	50% {
-		border-color: $color-secondary-l;
-		color: $color-secondary-l;
-	}
-
-	100% {
-		border-color: $color-secondary; 
-		color: $color-secondary;
-	}
-}
-
-@keyframes blue-pulse-background {
-	0% {
-		background-color: $color-secondary;
-	}
-
-	50% {
-		background-color: $color-secondary-l;
-	}
-
-	100% { 
-		background-color: $color-secondary;
-	}
-}

assets/scss/styles/globals/_old.scss

@@ -1,211 +0,0 @@
-/* stylelint-disable color-no-hex */
-/* stylelint-disable selector-max-id */
-
-* {
-    box-sizing:border-box;
-}
-
-hr {
-    display:block;
-    padding:1.5dp;
-    background: $color-background-1;
-}
-
-body {
-    color: #fff;
-    font-size: 20dp;
-    font-style: normal;
-    font-weight: normal
-}
-
-/* div { 
-    focus:none;
-    tab-index:none;
-} */
-
-div#window {
-    position: relative;
-    box-sizing: border-box;
-    width: 100%;
-    height: 100%;
-    border-color: $color-border;
-    background-color: $color-background-2;
-}
-
-div#content {
-    z-index: 2;
-    width: auto;
-    height: 100%;
-    overflow: hidden auto;
-    text-align: center
-}
-
-p {
-    text-align: left;
-}
-
-input.submit {
-    margin-left: 0
-}
-
-
-input.text,
-input.password {
-    box-sizing: border-box;
-    height: 31dp;
-    padding: 11dp 10dp 0;
-    text-align: left;
-    cursor: text
-}
-
-textarea {
-    padding: 14dp 12dp 10dp;
-    text-align: left;
-    cursor: text
-}
-
-input.text,
-input.password,
-select,
-textarea {
-    /* color: #333; */
-
-    /* font-size: 13dp */
-    height: auto;
-}
-
-table input.text {
-    box-sizing: border-box;
-    width: 100%;
-    height: auto;
-
-    /* height: 18dp; */
-    margin: 0;
-    border-width: $border-width-thickness;
-    border-color: #000;
-    background-color: #fff;
-    font-size: 15dp;
-
-    /* padding: 0 5dp; */
-    line-height: 1;
-    decorator: none;
-
-    /* vertical-align: center; */
-}
-
-select {
-    // display: inline-block;
-    // /* width: 175dp; */
-    // /* height: 37dp; */
-    // /* height: auto; */
-    // text-align: left;
-    // box-sizing:border-box;
-    // /* padding: 4dp; */
-    // vertical-align: center;
-    // padding: 4dp;
-    // border-radius: 5dp;
-    // background-color: rgb(120, 120, 120);
-    // width: 100%;
-}
-// select {
-//     @extend %body;
-//     display: flex;
-//     align-items: center;
-//     justify-content: flex-start;
-//     box-sizing: border-box;
-//     padding: space(16);
-//     flex: 1 1 100%;
-//     // width: auto;
-//     height: space(1000);
-//     border-radius: $border-radius-lg;
-//     background-color: $color-white-a20;
-// }
-
-// select selectvalue {
-//     height: auto;
-//     /* padding: 4dp; */
-//     /* margin-right: 30dp; */
-//     /* height: 25dp; */
-//     /* padding: 4dp; */
-//     /* decorator: image(selectvalue) */
-// }
-
-// select:hover selectvalue {
-//     /* margin-right: 30dp; */
-//     /* height: 25dp; */
-//     /* padding: 4dp; */
-//     background-color: rgb(150, 150, 150);
-//     /* decorator: image(selectvalue) */
-// }
-
-// select selectarrow {
-//     /* width: 30dp; */
-//     /* height: 37dp; */
-//     /* decorator: image(selectarrow) */
-//     /* background-color: black; */
-//     /* appearance: none; */
-// }
-
-// select:hover selectarrow {
-//     /* decorator: image(selectarrow-hover) */
-// }
-
-// select:active selectarrow,
-// select selectarrow:checked {
-//     /* decorator: image(selectarrow-active) */
-// }
-
-// select selectbox {
-//     /* margin-left: 1dp; */
-//     /* margin-top: -7dp; */
-//     /* margin-bottom: -10dp; */
-//     /* width: 162dp; */
-//     /* padding: 1dp 4dp 4dp 4dp */
-// }
-
-// select selectbox,
-// tbody {
-//     background-color: rgb(120,120,120);
-//     /* decorator: tiled-box(selectbox-tl, selectbox-t, selectbox-tr, selectbox-l, selectbox-c, auto, selectbox-bl, selectbox-b, selectbox-br) */
-// }
-
-// select selectbox option {
-//     width: auto;
-//     background-color: rgb(120, 120, 120)
-// }
-
-// select selectbox option:nth-child(even),
-// tr:nth-child(even) {
-//     background-color: rgb(100, 100, 100)
-// }
-
-// select selectbox option:checked {
-//     font-weight:bold;
-//     color:rgb(255,255,255);
-// }
-
-// select selectbox option:hover {
-//     background: rgb(150,150,150)
-// }
-
-input.radio {
-    flex: 0;
-    width:0dp;
-    nav-up:auto;
-    nav-right:auto;
-    nav-down:auto;
-    nav-left:auto;
-    tab-index:auto;
-    focus:auto;
-}
-
-input.checkbox {
-    width: space(20);
-    height: space(20);
-    nav-up:auto;
-    nav-right:auto;
-    nav-down:auto;
-    nav-left:auto;
-    tab-index:auto;
-    focus:auto;
-}

assets/scss/styles/globals/_scrollbars.scss

@@ -1,52 +0,0 @@
-@use 'sass:math';
-
-$scrollbar-width: 12;
-
-@mixin _set-scroll-size($size-key) {
-    #{$size-key}: space($scrollbar-width);
-    
-    slidertrack {
-        #{$size-key}: space($scrollbar-width);
-    }
-    
-    sliderbar {
-        #{$size-key}: space($scrollbar-width);
-    }
-}
-
-scrollbarvertical,scrollbarhorizontal {
-    margin: 0;
-    border: 0;
-    
-    slidertrack {
-        background: $color-primary-l;
-        opacity: 0.05;
-    }
-    
-    sliderbar {
-        border-radius: space(math.div($scrollbar-width, 2) - 1);
-        background: $color-primary-l;
-        opacity: 0.1;
-
-        &:hover:not(:active) {
-            opacity: 0.2;
-        }
-
-        &:active {
-            opacity: 0.3;
-        }
-    }
-    
-    sliderarrowdec, sliderarrowinc {
-        width: 0;
-        height: 0;
-    }
-}
-
-scrollbarvertical {
-    @include _set-scroll-size(width);
-}
-
-scrollbarhorizontal {
-    @include _set-scroll-size(height);
-}

assets/scss/styles/mixins/_helpers.scss

@@ -1,39 +0,0 @@
-
-%nav-vert {
-    nav-up: auto;
-    nav-down: auto;
-}
-
-%nav-horiz {
-    nav-right: auto;
-    nav-left: auto;
-}
-
-%nav-dir {
-    @extend %nav-vert;
-    @extend %nav-horiz;
-}
-
-%nav-foc {
-    focus: auto;
-    tab-index: auto;
-}
-
-%nav-all {
-    @extend %nav-dir;
-    @extend %nav-foc;
-}
-
-@mixin set-svgs-color($col) {
-    svg {
-        image-color: $col;
-    }
-}
-
-/*
-@include set-color(COLOR);
-*/
-@mixin set-color($col) {
-    @include set-svgs-color($col);
-    color: $col;
-}

assets/scss/styles/mixins/_transitions.scss

@@ -1,36 +0,0 @@
-
-/*
-@include trans-colors;
-*/
-@mixin trans-colors {
-    transition: color $transition-quick, background-color $transition-quick;
-}
-
-/*
-@include trans-colors-opa;
-*/
-@mixin trans-colors-opa {
-    transition: color $transition-quick, background-color $transition-quick, opacity $transition-quick;
-}
-
-/*
-@include trans-colors-svg;
-*/
-@mixin trans-colors-svg {
-    transition: color $transition-quick, background-color $transition-quick, opacity $transition-quick;
-
-    svg {
-        transition: image-color $transition-quick, background-color $transition-quick;
-    }
-}
-
-/*
-@include trans-colors-border;
-*/
-@mixin trans-colors-border {
-    transition: color $transition-quick, background-color $transition-quick, opacity $transition-quick, border-color $transition-quick;
-
-    svg {
-        transition: image-color $transition-quick, background-color $transition-quick;
-    }
-}

assets/scss/styles/mixins/_typography.scss

@@ -1,83 +0,0 @@
-
-$font-stack: 'Suplexmentary Comic NC';
-
-@mixin set-font-sizing($sz, $spacing) {
-    // font-family: $font-stack;
-    $sz-add: $sz + 4;
-    font-size: space($sz-add);
-    letter-spacing: space($sz-add * $spacing);
-    line-height: space($sz-add);
-}
-
-%header-1 {
-    @include set-font-sizing(64, 0.07);
-    font-style: normal;
-	font-weight: 700;
-}
-
-%header-2 {
-    @include set-font-sizing(48, 0.07);
-    font-style: normal;
-	font-weight: 700;
-}
-
-%header-3 {
-    @include set-font-sizing(32, 0.07);
-    font-style: normal;
-	font-weight: 700;
-}
-
-%label-lg {
-    @include set-font-sizing(32, 0.11);
-    font-style: normal;
-	font-weight: 700;
-}
-
-%label-md {
-    @include set-font-sizing(24, 0.11);
-    font-style: normal;
-	font-weight: 700;
-}
-
-%label-sm {
-    @include set-font-sizing(16, 0.14);
-    font-style: normal;
-	font-weight: 700;
-    text-transform: uppercase;
-}
-
-%label-xs {
-    @include set-font-sizing(14, 0.14);
-    font-style: normal;
-	font-weight: 400;
-}
-
-%body {
-    @include set-font-sizing(16, 0.0);
-    font-style: normal;
-	font-weight: 400;
-}
-
-%prompt-font-lg {
-    font-family: promptfont;
-    font-size: space(56);
-    font-style: normal;
-    font-weight: 400;
-    line-height: space(56);
-}
-
-%prompt-font {
-    font-family: promptfont;
-    font-size: space(40);
-    font-style: normal;
-    font-weight: 400;
-    line-height: space(40);
-}
-
-%prompt-font-sm {
-    font-family: promptfont;
-    font-size: space(32);
-    font-style: normal;
-    font-weight: 400;
-    line-height: space(32);
-}

assets/scss/styles/pages/_pages.scss

@@ -1 +0,0 @@
-@import "./config/config";

assets/scss/styles/pages/config/_config.scss

@@ -1 +0,0 @@
-@import "./debug";

assets/scss/styles/pages/config/debug.scss

@@ -1,178 +0,0 @@
-
-.config-debug {
-    display: block;
-    position: relative;
-    width: 100%;
-    max-height: 100%;
-    padding: space(8);
-}
-
-.config-debug__scroll {
-    display: block;
-    position: relative;
-    width: 100%;
-    max-height: 100%;
-    overflow-y: auto;
-}
-
-.config-debug-option {
-    @include set-color($color-text-dim);
-    @include trans-colors-svg;
-    @include border-bottom($color-border-soft);
-    display: block;
-    position: relative;
-    flex-direction: column;
-    width: 100%;
-    height: auto;
-    padding: space(12) space(4);
-    background-color: rgba(0, 0, 0, 0);
-
-    &:focus:not(:disabled, [disabled]),
-    &:focus-visible:not(:disabled, [disabled]),
-    &:hover:not(:disabled, [disabled]) {
-        @include set-color($color-text);
-        background-color: $color-bg-overlay;
-    }
-
-    &:disabled, &[disabled] {
-        opacity: 0.5;
-    }
-
-    .icon-button {
-        margin-left: space(8);
-    }
-}
-
-.config-debug__option-split {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: space-between;
-}
-
-.config-debug-option__label {
-    @extend %label-md;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
-    padding: space(4) space(16) space(12);
-    width: auto;
-    height: auto;
-    white-space: nowrap;
-}
-
-.config-debug__option-controls {
-    display: block;
-    position: relative;
-    flex: 1 1 auto;
-    height: auto;
-    width: auto;
-    max-width: space(800);
-    padding: 0 space(12);
-}
-
-.config-debug__option-trigger {
-    flex: 1 1 auto;
-}
-
-.config-debug__select-wrapper {
-    display: flex;
-    position: relative;
-    flex-direction: row;
-    align-items: center;
-    justify-content: flex-start;
-    flex: 1 1 100%;
-    width: auto;
-    max-width: space(800);
-    height: auto;
-    padding: space(4);
-
-    .config-debug__select-label {
-        @extend %label-sm;
-        padding-right: space(16);
-        flex: auto;
-        width: space(196);
-
-        > div {
-            display: inline;
-            width: auto;
-            height: auto;
-        }
-    }
-
-    input {
-        @extend %body;
-        @extend %nav-all;
-        display: block;
-        position: relative;
-        box-sizing: border-box;
-        padding: 0;
-        flex: 1 1 100%;
-        width: auto;
-        height: space(20);
-        margin: auto 0;
-    }
-
-    select {
-        @extend %body;
-        @extend %nav-all;
-        @include trans-colors-border;
-        @include border($color-white-a50);
-        display: block;
-        position: relative;
-        box-sizing: border-box;
-        padding: 0;
-        flex: 1 1 100%;
-        width: auto;
-        height: space(48);
-        border-radius: $border-radius-md;
-        background-color: $color-white-a5;
-        cursor: pointer;
-
-        align-items: center;
-        justify-content: flex-start;
-        padding: space(14);
-
-        &:hover, &:focus {
-            @include border($color-white-a80);
-            background-color: $color-white-a20;
-        }
-
-        selectvalue {
-            display: inline;
-            margin: auto 0;
-            height: auto;
-        }
-
-        selectbox {
-            @include border($color-white-a80);
-            background-color: $color-background-3;
-            padding: space(4) 0;
-            margin-top: space(2);
-            border-radius: $border-radius-md;
-            
-            option {
-                @extend %nav-all;
-                @include trans-colors;
-                padding: space(8) space(12);
-                background-color: $color-transparent;
-                color: $color-text-dim;
-                font-weight: 400;
-
-                &:hover, &:focus {
-                    background-color: $color-white-a20;
-                }
-
-                &:hover:not(:checked) {
-                    cursor: pointer;
-                }
-
-                &:checked {
-                    color: $color-white;
-                    background-color: $color-white-a5;
-                }
-            }
-        }
-    }
-}

assets/scss/styles/vars/_animations.scss

@@ -1,4 +0,0 @@
-
-$focus-anim: blue-pulse-with-border 0.75s infinite;
-$focus-anim-border: blue-pulse 0.75s infinite;
-$focus-anim-bg: blue-pulse-background 0.75s infinite;

assets/scss/styles/vars/_borders.scss

@@ -1,42 +0,0 @@
-
-$border-radius-sm: 8dp;
-$border-radius-md: 12dp;
-// modals/pages
-$border-radius-lg: 16dp;
-
-$border-radius-modal: $border-radius-lg;
-
-$border-width-thickness-num: 1.1;
-// $border-width-thickness-num: 1.5;
-$border-width-thickness: space($border-width-thickness-num);
-
-@mixin border($col: $color-border) {
-    border-width: $border-width-thickness;
-    border-color: $col;
-}
-
-@mixin border-top($col: $color-border) {
-    border-top-width: $border-width-thickness;
-    border-top-color: $col;
-}
-
-@mixin border-bottom($col: $color-border) {
-    border-bottom-width: $border-width-thickness;
-    border-bottom-color: $col;
-}
-
-@mixin inset-block($inset-amt) {
-    position: absolute;
-    top: $inset-amt;
-    right: $inset-amt;
-    bottom: $inset-amt;
-    left: $inset-amt;
-}
-
-// add this to a child of the container that needs a border.
-// parent must have `position: relative` 
-@mixin inner-border-block($col: $color-border) {
-    @include inset-block($border-width-thickness);
-    @include border($col);
-    display: block;
-}

assets/scss/styles/vars/_colors.scss

@@ -1,83 +0,0 @@
-/* stylelint-disable color-no-hex, color-hex-length */
-
-$color-background-1: Background1;
-$color-background-2: Background2;
-$color-background-3: Background3;
-$color-bg-overlay: BGOverlay;
-$color-modal-overlay: ModalOverlay;
-$color-bg-shadow: BGShadow;
-$color-bg-shadow-2: BGShadow2;
-$color-text: Text;
-$color-text-active: TextActive;
-$color-text-dim: TextDim;
-$color-text-inactive: TextInactive;
-$color-text-a5: TextA5;
-$color-text-a20: TextA20;
-$color-text-a30: TextA30;
-$color-text-a50: TextA50;
-$color-text-a80: TextA80;
-$color-primary: Primary;
-$color-primary-l: PrimaryL;
-$color-primary-d: PrimaryD;
-$color-primary-a5: PrimaryA5;
-$color-primary-a20: PrimaryA20;
-$color-primary-a30: PrimaryA30;
-$color-primary-a50: PrimaryA50;
-$color-primary-a80: PrimaryA80;
-$color-secondary: Secondary;
-$color-secondary-l: SecondaryL;
-$color-secondary-d: SecondaryD;
-$color-secondary-a5: SecondaryA5;
-$color-secondary-a20: SecondaryA20;
-$color-secondary-a30: SecondaryA30;
-$color-secondary-a50: SecondaryA50;
-$color-secondary-a80: SecondaryA80;
-$color-warning: Warning;
-$color-warning-l: WarningL;
-$color-warning-d: WarningD;
-$color-warning-a5: WarningA5;
-$color-warning-a20: WarningA20;
-$color-warning-a30: WarningA30;
-$color-warning-a50: WarningA50;
-$color-warning-a80: WarningA80;
-$color-danger: Danger;
-$color-danger-l: DangerL;
-$color-danger-d: DangerD;
-$color-danger-a5: DangerA5;
-$color-danger-a20: DangerA20;
-$color-danger-a30: DangerA30;
-$color-danger-a50: DangerA50;
-$color-danger-a80: DangerA80;
-$color-success: Success;
-$color-success-l: SuccessL;
-$color-success-d: SuccessD;
-$color-success-a5: SuccessA5;
-$color-success-a20: SuccessA20;
-$color-success-a30: SuccessA30;
-$color-success-a50: SuccessA50;
-$color-success-a80: SuccessA80;
-$color-border: Border;
-$color-border-soft: BorderSoft;
-$color-border-hard: BorderHard;
-$color-border-solid: BorderSolid;
-$color-transparent: Transparent;
-$color-a: A;
-$color-a-l: AL;
-$color-a-d: AD;
-$color-a-a5: AA5;
-$color-a-a20: AA20;
-$color-a-a30: AA30;
-$color-a-a50: AA50;
-$color-a-a80: AA80;
-$color-white: White;
-$color-white-a5: WhiteA5;
-$color-white-a20: WhiteA20;
-$color-white-a30: WhiteA30;
-$color-white-a50: WhiteA50;
-$color-white-a80: WhiteA80;
-$color-bw-05: BW05;
-$color-bw-10: BW10;
-$color-bw-25: BW25;
-$color-bw-50: BW50;
-$color-bw-75: BW75;
-$color-bw-90: BW90;

assets/scss/styles/vars/_gradients.scss

@@ -1,9 +0,0 @@
-
-// Not supported yet, need to use decorator: gradient atm
-// $primary-lr-fade: linear-gradient(90deg, rgba($color-primary-l, 0.08) 0%, rgba($color-primary-l, 0.00) 100%);
-// $primary-rl-fade: linear-gradient(90deg, rgba($color-primary-l, 0.00) 0%, rgba($color-primary-l, 0.08) 100%);
-
-// $primary-lr-fade: horizontal-gradient(#{$color-primary-d}14 #{$color-primary-l}00);
-// $primary-rl-fade: horizontal-gradient(#{$color-primary-d}00 #{$color-primary-l}14);
-$primary-lr-fade: horizontal-gradient(#ff000014 #ff000000);
-$primary-rl-fade: horizontal-gradient(#ff000000 #ff000014);

assets/scss/styles/vars/_spacing.scss

@@ -1,7 +0,0 @@
-@use 'sass:math';
-
-// $page-margin: 32;
-$page-margin: 64;
-$base-height: 1080;
-$base-modal-height: $base-height - ($page-margin * 2);
-$base-modal-max-width: math.div($base-modal-height * 16, 9);

assets/scss/styles/vars/_transitions.scss

@@ -1,3 +0,0 @@
-// see: lib/RmlUi/Source/Core/PropertyParserAnimation.cpp
-$transition-quick: 0.05s linear-in-out;
-// $transition-quick: 0.033s linear-in-out;

banjo.us.rev0.toml

@@ -4,23 +4,40 @@
 entrypoint = 0x80000400
 # Paths are relative to the location of this config file.
 output_func_path = "RecompiledFuncs"
-symbols_file_path = "BanjoRecompSyms/bk.us.rev0.syms.toml"
 rom_file_path = "banjo.us.v10.decompressed.z64"
+symbols_file_path = "BanjoRecompSyms/bk.us.rev0.syms.toml"
 # elf_path = "banjo.us.v10.elf"
+# use_mdebug = true
+# trace_mode = true
+bss_section_suffix = "_bss"
 
 manual_funcs = [
-    { name = "__n_CSPVoiceHandler", section = ".core1", vram = 0x8025E438, size = 0x684 },
+    { name = "boot___osLeoAbnormalResume", section = ".boot_bk_boot", vram = 0x800037E4, size = 0xE8 },
+    { name = "boot___osLeoResume", section = ".boot_bk_boot", vram = 0x800038CC, size = 0xEC },
+]
+
+mdebug_file_mappings = [
+    { filename = "src/TTC/ch/clam.c", input_section = ".text", output_section = ".TTC" },
+    { filename = "src/TTC/ch/blubber.c", input_section = ".text", output_section = ".TTC" },
+    { filename = "src/TTC/ch/lockup.c", input_section = ".text", output_section = ".TTC" },
+    { filename = "src/TTC/ch/treasure.c", input_section = ".text", output_section = ".TTC" },
+    { filename = "src/SM/ch/attacktutorial.c", input_section = ".text", output_section = ".SM" },
+    { filename = "src/SM/ch/vegetables.c", input_section = ".text", output_section = ".SM" },
 ]
 
 [patches]
-stubs = [
+
+ignored = [
+    "boot_n_aspMainTextStart",
+    "boot_gSPF3DEX_fifoTextStart",
+    "boot_gSPL3DEX_fifoTextStart",
 ]
 
 renamed = [
     "wmemcpy"
 ]
 
-ignored = [
+stubs = [
     # Boot segment libultra duplicates
     "boot___ll_div",
     "boot___ll_lshift",
@@ -32,7 +49,6 @@ ignored = [
     "boot___ull_divremi",
     "boot___ull_rem",
     "boot___ull_rshift",
-    "boot___osInitialize_common",
     "boot_osPiRawStartDma",
     "boot_osPiGetStatus",
     "boot___osSetSR",

flatpak/.gitignore

@@ -0,0 +1,4 @@
+.flatpak-builder
+builddir
+repo
+*.flatpak

flatpak/README.md

@@ -0,0 +1,15 @@
+Before building the Flatpak, you must build the patches on the root directory first. **The LLVM Extension for freedesktop does not include the MIPS compiler and will fail to build the patches inside the flatpak**.
+```sh
+make -C patches CC=clang LD=ld.lld
+```
+
+Build
+```sh
+flatpak-builder --force-clean --user --install-deps-from=flathub --repo=repo --install builddir io.github.banjorecomp.banjorecomp.json
+```
+
+Bundle
+```sh
+flatpak build-bundle repo io.github.banjorecomp.banjorecomp.flatpak io.github.banjorecomp.banjorecomp --runtime-repo=https://flathub.org/repo/flathub.flatpakrepo
+```
+

flatpak/io.github.banjorecomp.banjorecomp.desktop

@@ -0,0 +1,8 @@
+[Desktop Entry]
+Name=Banjo: Recompiled
+Exec=/app/bin/BanjoRecompiled
+Type=Application
+Icon=io.github.banjorecomp.banjorecomp
+Categories=Game;
+Comment=Static recompilation of Banjo-Kazooie for PC.
+MimeType=x-scheme-handler/banjorecomp

flatpak/io.github.banjorecomp.banjorecomp.json

@@ -0,0 +1,62 @@
+{
+  "id": "io.github.banjorecomp.banjorecomp",
+  "runtime": "org.freedesktop.Platform",
+  "runtime-version": "25.08",
+  "sdk": "org.freedesktop.Sdk",
+  "sdk-extensions" : [ "org.freedesktop.Sdk.Extension.llvm20" ],
+  "finish-args": [
+    "--share=network",
+    "--socket=wayland",
+    "--socket=fallback-x11",
+    "--socket=pulseaudio",
+    "--device=all",
+    "--filesystem=host",
+    "--filesystem=/media",
+    "--filesystem=/run/media",
+    "--filesystem=/mnt"
+  ],
+  "modules": [
+    {
+      "name": "BanjoRecompiled",
+      "buildsystem": "simple",
+      "build-commands": [
+        "cmake -DCMAKE_BUILD_TYPE=Release -DCMAKE_CXX_COMPILER=clang++ -DCMAKE_C_COMPILER=clang -DCMAKE_MAKE_PROGRAM=ninja -G Ninja -S lib/N64Recomp -B lib/N64Recomp/cmake-build",
+        "cmake --build lib/N64Recomp/cmake-build --config Release --target N64Recomp --parallel",
+        "cmake --build lib/N64Recomp/cmake-build --config Release --target RSPRecomp --parallel",
+        "cp lib/N64Recomp/cmake-build/N64Recomp N64Recomp",
+        "cp lib/N64Recomp/cmake-build/RSPRecomp RSPRecomp",
+        "./N64Recomp banjo.us.rev0.toml",
+        "./RSPRecomp n_aspMain.us.rev0.toml",
+        "cmake -DCMAKE_BUILD_TYPE=Release -DCMAKE_CXX_COMPILER=clang++ -DCMAKE_C_COMPILER=clang -DCMAKE_MAKE_PROGRAM=ninja -DPATCHES_C_COMPILER=clang -DPATCHES_LD=ld.lld -DRECOMP_FLATPAK=ON -G Ninja -S . -B cmake-build",
+        "cmake --build cmake-build --config Release --target BanjoRecompiled --parallel",
+        "rm -rf assets/scss",
+        "mkdir -p /app/bin",
+        "cp cmake-build/BanjoRecompiled /app/bin/BanjoRecompiled",
+        "cp recompcontrollerdb.txt /app/bin/recompcontrollerdb.txt",
+        "cp -R assets /app/bin/assets",
+        "install -Dm644 icons/app.png /app/share/icons/hicolor/512x512/apps/${FLATPAK_ID}.png",
+        "install -Dm644 flatpak/io.github.banjorecomp.banjorecomp.metainfo.xml /app/share/metainfo/${FLATPAK_ID}.metainfo.xml",
+        "install -Dm644 flatpak/io.github.banjorecomp.banjorecomp.desktop /app/share/applications/${FLATPAK_ID}.desktop"
+      ],
+      "sources": [
+        {
+          "type": "git",
+          "url": "https://github.com/N64Recomp/N64Recomp.git",
+          "commit": "2b6f05688de2abc7d86da5b4a89b84c2c6acbabe",
+          "dest": "lib/N64Recomp"
+        },
+        {
+          "type": "dir",
+          "path": "../"
+        }
+      ],
+      "build-options": {
+        "append-path": "/usr/lib/sdk/llvm20/bin",
+        "prepend-ld-library-path": "/usr/lib/sdk/llvm20/lib",
+        "build-args": [
+          "--share=network"
+        ]
+      }
+    }
+  ]
+}

flatpak/io.github.banjorecomp.banjorecomp.metainfo.xml

@@ -0,0 +1,29 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<component type="desktop-application">
+  <id>io.github.banjorecomp.banjorecomp</id>
+  
+  <name>Banjo: Recompiled</name>
+  <summary>Static recompilation of Banjo-Kazooie for PC.</summary>
+  
+  <metadata_license>CC0-1.0</metadata_license>
+  <project_license>GPL-3.0+</project_license>
+  
+  <supports>
+    <control>pointing</control>
+    <control>keyboard</control>
+    <control>touch</control>
+    <control>gamepad</control>
+  </supports>
+  
+  <description>
+    <p>
+      Banjo: Recompiled is a project that uses N64: Recompiled to statically recompile Banjo-Kazoie into a native port with many new features and enhancements. This project uses RT64 as the rendering engine to provide some of these enhancements.
+
+      The original game is required to run this project.
+
+      https://github.com/BanjoRecomp/BanjoRecomp
+    </p>
+  </description>
+  
+  <launchable type="desktop-id">io.github.banjorecomp.banjorecomp.desktop</launchable>
+</component>

icons/README.md

@@ -0,0 +1,18 @@
+When making icons for Windows, it is important to generate the multiple ICO files on different sizes and pack them into one single ICO file.
+
+Using a tool such as `icomake` is recommended for this: https://github.com/tringi/icomake
+
+The recommended workflow is to progressively downscale the icon into the following sizes and export them from a tool that supports exporting to ICO:
+
+- 256.ico, 256x256 
+- 128.ico, 128x128
+- 64.ico, 64x64
+- 32.ico, 32x32
+- 16.ico, 16x16
+
+Once these are ready, `icomake` can pack these into one icon with the following command:
+```
+.\icomake.exe app.ico 16.ico 32.ico 64.ico 128.ico 256.ico
+```
+
+If done correctly, Windows will now pick the icon with the correct size on the title bar, the taskbar and as a shortcut.

icons/app.rc

@@ -0,0 +1,2 @@
+1 ICON "appb.ico"
+2 ICON "appk.ico"

include/banjo_config.h

@@ -2,53 +2,57 @@
 #define __BANJO_CONFIG_H__
 
 #include <filesystem>
+#include <string>
 #include <string_view>
-#include "ultramodern/config.hpp"
-#include "recomp_input.h"
+
+#include "json/json.hpp"
 
 namespace banjo {
-    constexpr std::u8string_view program_id = u8"BanjoRecompiled";
-    constexpr std::string_view program_name = "Banjo: Recompiled";
+    inline const std::u8string program_id = u8"BanjoRecompiled";
+    inline const std::string program_name = "Banjo: Recompiled";
+
+    namespace configkeys {
+        namespace general {
+            inline const std::string note_saving_mode = "note_saving_mode";
+            inline const std::string camera_invert_mode = "camera_invert_mode";
+            inline const std::string analog_cam_mode = "analog_cam_mode";
+            inline const std::string third_person_camera_invert_mode = "third_person_camera_invert_mode";
+            inline const std::string flying_and_swimming_invert_mode = "flying_and_swimming_invert_mode";
+            inline const std::string first_person_invert_mode = "first_person_invert_mode";
+            inline const std::string analog_camera_sensitivity = "analog_camera_sensitivity";
+        }
+
+        namespace sound {
+            inline const std::string bgm_volume = "bgm_volume";
+        }
+
+        namespace graphics {
+            inline const std::string cutscene_aspect_ratio_mode = "cutscene_aspect_ratio_mode";
+        }
+    }
 
     // TODO: Move loading configs to the runtime once we have a way to allow per-project customization.
-    void load_config();
-    void save_config();
-    
-    void reset_input_bindings();
-    void reset_cont_input_bindings();
-    void reset_kb_input_bindings();
-    void reset_single_input_binding(recomp::InputDevice device, recomp::GameInput input);
+    void init_config();
 
-    std::filesystem::path get_app_folder_path();
-    
-    bool get_debug_mode_enabled();
-    void set_debug_mode_enabled(bool enabled);
-    
     enum class CameraInvertMode {
         InvertNone,
         InvertX,
         InvertY,
-        InvertBoth,
-        OptionCount
+        InvertBoth
     };
 
-    NLOHMANN_JSON_SERIALIZE_ENUM(banjo::CameraInvertMode, {
-        {banjo::CameraInvertMode::InvertNone, "InvertNone"},
-        {banjo::CameraInvertMode::InvertX, "InvertX"},
-        {banjo::CameraInvertMode::InvertY, "InvertY"},
-        {banjo::CameraInvertMode::InvertBoth, "InvertBoth"}
-    });
-
     CameraInvertMode get_camera_invert_mode();
-    void set_camera_invert_mode(CameraInvertMode mode);
 
-    CameraInvertMode get_analog_camera_invert_mode();
-    void set_analog_camera_invert_mode(CameraInvertMode mode);
+    CameraInvertMode get_third_person_camera_mode();
+
+    CameraInvertMode get_flying_and_swimming_invert_mode();
+
+    CameraInvertMode get_first_person_invert_mode();
 
     enum class AnalogCamMode {
         On,
         Off,
-		OptionCount
+        OptionCount
     };
 
     NLOHMANN_JSON_SERIALIZE_ENUM(banjo::AnalogCamMode, {
@@ -57,7 +61,30 @@ namespace banjo {
     });
 
     AnalogCamMode get_analog_cam_mode();
-    void set_analog_cam_mode(AnalogCamMode mode);
+
+    uint32_t get_analog_cam_sensitivity();
+
+    enum class NoteSavingMode {
+        On,
+        Off,
+        OptionCount
+    };
+
+    NLOHMANN_JSON_SERIALIZE_ENUM(banjo::NoteSavingMode, {
+        {banjo::NoteSavingMode::On, "On"},
+        {banjo::NoteSavingMode::Off, "Off"}
+    });
+
+    NoteSavingMode get_note_saving_mode();
+
+    enum class CutsceneAspectRatioMode {
+        Original,
+        Clamp16x9,
+        Full,
+        OptionCount
+    };
+
+    CutsceneAspectRatioMode get_cutscene_aspect_ratio_mode();
 
     void open_quit_game_prompt();
 };

include/banjo_launcher.h

@@ -0,0 +1,16 @@
+#ifndef __BANJO_LAUNCHER_H__
+#define __BANJO_LAUNCHER_H__
+
+#include "recompui/recompui.h"
+
+namespace banjo {
+    void launcher_animation_setup(recompui::LauncherMenu *menu);
+    void launcher_animation_update(recompui::LauncherMenu *menu);
+
+    constexpr float launcher_options_right_position_start = 96.0f;
+    constexpr float launcher_options_right_position_end = 96.0f + 24.0f;
+    constexpr float launcher_options_top_offset = 96.0f;
+    constexpr float launcher_options_title_offset = 120.0f;
+}
+
+#endif

include/banjo_render.h

@@ -1,61 +0,0 @@
-#ifndef __BANJO_RENDER_H__
-#define __BANJO_RENDER_H__
-
-#include <unordered_set>
-#include <filesystem>
-
-#include "common/rt64_user_configuration.h"
-#include "ultramodern/renderer_context.hpp"
-#include "librecomp/mods.hpp"
-
-namespace RT64 {
-    struct Application;
-}
-
-namespace banjo {
-    namespace renderer {
-        inline const std::string special_option_texture_pack_enabled = "_recomp_texture_pack_enabled";
-
-        class RT64Context final : public ultramodern::renderer::RendererContext {
-        public:
-            ~RT64Context() override;
-            RT64Context(uint8_t *rdram, ultramodern::renderer::WindowHandle window_handle, bool developer_mode);
-
-            bool valid() override { return static_cast<bool>(app); }
-
-            bool update_config(const ultramodern::renderer::GraphicsConfig &old_config, const ultramodern::renderer::GraphicsConfig &new_config) override;
-
-            void enable_instant_present() override;
-            void send_dl(const OSTask *task) override;
-            void update_screen(uint32_t vi_origin) override;
-            void shutdown() override;
-            uint32_t get_display_framerate() const override;
-            float get_resolution_scale() const override;
-
-        private:
-            std::unique_ptr<RT64::Application> app;
-            std::unordered_set<std::string> enabled_texture_packs;
-            std::unordered_set<std::string> secondary_disabled_texture_packs;
-
-            void check_texture_pack_actions();
-        };
-
-        std::unique_ptr<ultramodern::renderer::RendererContext> create_render_context(uint8_t *rdram, ultramodern::renderer::WindowHandle window_handle, bool developer_mode);
-
-        RT64::UserConfiguration::Antialiasing RT64MaxMSAA();
-        bool RT64SamplePositionsSupported();
-        bool RT64HighPrecisionFBEnabled();
-
-        void trigger_texture_pack_update();
-        void enable_texture_pack(const recomp::mods::ModContext& context, const recomp::mods::ModHandle& mod);
-        void disable_texture_pack(const recomp::mods::ModHandle& mod);
-        void secondary_enable_texture_pack(const std::string& mod_id);
-        void secondary_disable_texture_pack(const std::string& mod_id);
-
-        // Texture pack enable option. Must be an enum with two options.
-        // The first option is treated as disabled and the second option is treated as enabled.
-        bool is_texture_pack_enable_config_option(const recomp::mods::ConfigOption& option, bool show_errors);
-    }
-}
-
-#endif

include/banjo_sound.h

@@ -2,10 +2,6 @@
 #define __BANJO_SOUND_H__
 
 namespace banjo {
-    void reset_sound_settings();
-    void set_main_volume(int volume);
-    int get_main_volume();
-    void set_bgm_volume(int volume);
     int get_bgm_volume();
 }
 

include/recomp_data.h

@@ -2,8 +2,8 @@
 #define __RECOMP_DATA_H__
 
 namespace recomputil {
-    void init_extended_actor_data();
-    void reset_actor_data();
+    void init_extended_object_data(size_t num_types);
+    void clear_all_object_data(size_t type_index);
 
     void register_data_api_exports();
 }

include/recomp_input.h

@@ -1,202 +0,0 @@
-#ifndef __RECOMP_INPUT_H__
-#define __RECOMP_INPUT_H__
-
-#include <cstdint>
-#include <variant>
-#include <vector>
-#include <type_traits>
-#include <span>
-#include <string>
-#include <string_view>
-
-#include "ultramodern/input.hpp"
-
-#include "json/json.hpp"
-
-namespace recomp {
-    // x-macros to build input enums and arrays.
-    // First parameter is the enum name, second parameter is the bit field for the input (or 0 if there is no associated one), third is the readable name.
-    // TODO refactor this to allow projects to rename these, or get rid of the readable name and leave that up to individual projects to map.
-    #define DEFINE_N64_BUTTON_INPUTS() \
-        DEFINE_INPUT(A, 0x8000, "A") \
-        DEFINE_INPUT(B, 0x4000, "B") \
-        DEFINE_INPUT(Z, 0x2000, "Z") \
-        DEFINE_INPUT(START, 0x1000, "Start") \
-        DEFINE_INPUT(L, 0x0020, "L") \
-        DEFINE_INPUT(R, 0x0010, "R") \
-        DEFINE_INPUT(C_UP, 0x0008, "C Up") \
-        DEFINE_INPUT(C_LEFT, 0x0002, "C Left") \
-        DEFINE_INPUT(C_DOWN, 0x0004, "C Down") \
-        DEFINE_INPUT(C_RIGHT, 0x0001, "C Right") \
-        DEFINE_INPUT(DPAD_UP, 0x0800, "D Pad Down") \
-        DEFINE_INPUT(DPAD_RIGHT, 0x0100, "D-Pad Down") \
-        DEFINE_INPUT(DPAD_DOWN, 0x0400, "D-Pad Down") \
-        DEFINE_INPUT(DPAD_LEFT, 0x0200, "D-Pad Down")
-
-    #define DEFINE_N64_AXIS_INPUTS() \
-        DEFINE_INPUT(Y_AXIS_POS, 0, "Up") \
-        DEFINE_INPUT(Y_AXIS_NEG, 0, "Down") \
-        DEFINE_INPUT(X_AXIS_NEG, 0, "Left") \
-        DEFINE_INPUT(X_AXIS_POS, 0, "Right") \
-
-    #define DEFINE_RECOMP_UI_INPUTS() \
-        DEFINE_INPUT(TOGGLE_MENU, 0, "Toggle Menu") \
-        DEFINE_INPUT(ACCEPT_MENU, 0, "Accept (Menu)") \
-        DEFINE_INPUT(APPLY_MENU, 0, "Apply (Menu)")
-
-    #define DEFINE_ALL_INPUTS() \
-        DEFINE_N64_BUTTON_INPUTS() \
-        DEFINE_N64_AXIS_INPUTS() \
-        DEFINE_RECOMP_UI_INPUTS()
-
-    // Enum containing every recomp input.
-    #define DEFINE_INPUT(name, value, readable) name,
-    enum class GameInput {
-        DEFINE_ALL_INPUTS()
-
-        COUNT,
-        N64_BUTTON_START = A,
-        N64_BUTTON_COUNT = C_RIGHT - N64_BUTTON_START + 1,
-        N64_AXIS_START = X_AXIS_NEG,
-        N64_AXIS_COUNT = Y_AXIS_POS - N64_AXIS_START + 1,
-    };
-    #undef DEFINE_INPUT
-
-    struct InputField {
-        uint32_t input_type;
-        int32_t input_id;
-        std::string to_string() const;
-        auto operator<=>(const InputField& rhs) const = default;
-    };
-
-    void poll_inputs();
-    float get_input_analog(const InputField& field);
-    float get_input_analog(const std::span<const recomp::InputField> fields);
-    bool get_input_digital(const InputField& field);
-    bool get_input_digital(const std::span<const recomp::InputField> fields);
-    void get_gyro_deltas(float* x, float* y);
-    void get_mouse_deltas(float* x, float* y);
-    void get_right_analog(float* x, float* y);
-
-    enum class InputDevice {
-        Controller,
-        Keyboard,
-        COUNT
-    };
-
-    void start_scanning_input(InputDevice device);
-    void stop_scanning_input();
-    void finish_scanning_input(InputField scanned_field);
-    void cancel_scanning_input();
-    void config_menu_set_cont_or_kb(bool cont_interacted);
-    InputField get_scanned_input();
-    int get_scanned_input_index();
-    
-    struct DefaultN64Mappings {
-        std::vector<InputField> a;
-        std::vector<InputField> b;
-        std::vector<InputField> l;
-        std::vector<InputField> r;
-        std::vector<InputField> z;
-        std::vector<InputField> start;
-
-        std::vector<InputField> c_left;
-        std::vector<InputField> c_right;
-        std::vector<InputField> c_up;
-        std::vector<InputField> c_down;
-
-        std::vector<InputField> dpad_left;
-        std::vector<InputField> dpad_right;
-        std::vector<InputField> dpad_up;
-        std::vector<InputField> dpad_down;
-
-        std::vector<InputField> analog_left;
-        std::vector<InputField> analog_right;
-        std::vector<InputField> analog_up;
-        std::vector<InputField> analog_down;
-
-        std::vector<InputField> toggle_menu;
-        std::vector<InputField> accept_menu;
-        std::vector<InputField> apply_menu;
-    };
-
-    inline const std::vector<InputField>& get_default_mapping_for_input(const DefaultN64Mappings& defaults, const GameInput input) {
-        static const std::vector<InputField> empty_input_field{};
-        switch (input) {
-            case GameInput::A: return defaults.a;
-            case GameInput::B: return defaults.b;
-            case GameInput::L: return defaults.l;
-            case GameInput::R: return defaults.r;
-            case GameInput::Z: return defaults.z;
-            case GameInput::START: return defaults.start;
-            case GameInput::C_LEFT: return defaults.c_left;
-            case GameInput::C_RIGHT: return defaults.c_right;
-            case GameInput::C_UP: return defaults.c_up;
-            case GameInput::C_DOWN: return defaults.c_down;
-            case GameInput::DPAD_LEFT: return defaults.dpad_left;
-            case GameInput::DPAD_RIGHT: return defaults.dpad_right;
-            case GameInput::DPAD_UP: return defaults.dpad_up;
-            case GameInput::DPAD_DOWN: return defaults.dpad_down;
-            case GameInput::X_AXIS_NEG: return defaults.analog_left;
-            case GameInput::X_AXIS_POS: return defaults.analog_right;
-            case GameInput::Y_AXIS_POS: return defaults.analog_up;
-            case GameInput::Y_AXIS_NEG: return defaults.analog_down;
-            case GameInput::TOGGLE_MENU: return defaults.toggle_menu;
-            case GameInput::ACCEPT_MENU: return defaults.accept_menu;
-            case GameInput::APPLY_MENU: return defaults.apply_menu;
-            default: return empty_input_field;
-        }
-    }
-
-    extern const DefaultN64Mappings default_n64_keyboard_mappings;
-    extern const DefaultN64Mappings default_n64_controller_mappings;
-
-    constexpr size_t bindings_per_input = 2;
-
-    size_t get_num_inputs();
-    const std::string& get_input_name(GameInput input);
-    const std::string& get_input_enum_name(GameInput input);
-    GameInput get_input_from_enum_name(const std::string_view name);
-    InputField& get_input_binding(GameInput input, size_t binding_index, InputDevice device);
-    void set_input_binding(GameInput input, size_t binding_index, InputDevice device, InputField value);
-
-    bool get_n64_input(int controller_num, uint16_t* buttons_out, float* x_out, float* y_out);
-    void set_rumble(int controller_num, bool);
-    void update_rumble();
-    void handle_events();
-
-    ultramodern::input::connected_device_info_t get_connected_device_info(int controller_num);
-    
-    // Rumble strength ranges from 0 to 100.
-    int get_rumble_strength();
-    void set_rumble_strength(int strength);
-    
-    // Gyro and mouse sensitivities range from 0 to 100.
-    int get_gyro_sensitivity();
-    int get_mouse_sensitivity();
-    int get_joystick_deadzone();
-    void set_gyro_sensitivity(int strength);
-    void set_mouse_sensitivity(int strength);
-    void set_joystick_deadzone(int strength);
-    void apply_joystick_deadzone(float x_in, float y_in, float* x_out, float* y_out);
-    void set_right_analog_suppressed(bool suppressed);
-
-    enum class BackgroundInputMode {
-        On,
-        Off,
-		OptionCount
-    };
-
-    NLOHMANN_JSON_SERIALIZE_ENUM(recomp::BackgroundInputMode, {
-        {recomp::BackgroundInputMode::On, "On"},
-        {recomp::BackgroundInputMode::Off, "Off"}
-    });
-
-    BackgroundInputMode get_background_input_mode();
-    void set_background_input_mode(BackgroundInputMode mode);
-
-    bool game_input_disabled();
-    bool all_input_disabled();
-}
-
-#endif

include/recomp_ui.h

@@ -1,138 +0,0 @@
-#ifndef __RECOMP_UI__
-#define __RECOMP_UI__
-
-#include <memory>
-#include <string>
-#include <string_view>
-#include <list>
-
-// TODO move this file into src/ui
-
-#include "SDL.h"
-#include "RmlUi/Core.h"
-
-#include "../src/ui/util/hsv.h"
-#include "../src/ui/util/bem.h"
-#include "../src/ui/elements/ui_button.h"
-#include "../src/ui/elements/ui_theme.h"
-
-#include "../src/ui/core/ui_context.h"
-
-namespace Rml {
-    class ElementDocument;
-    class EventListenerInstancer;
-    class Context;
-    class Event;
-}
-
-namespace recompui {
-    class UiEventListenerInstancer;
-
-    // TODO remove this once the UI has been ported over to the new system.
-    class MenuController {
-    public:
-        virtual ~MenuController() {}
-        virtual void load_document() = 0;
-        virtual void register_events(UiEventListenerInstancer& listener) = 0;
-        virtual void make_bindings(Rml::Context* context) = 0;
-    };
-
-    std::unique_ptr<MenuController> create_launcher_menu();
-    std::unique_ptr<MenuController> create_config_menu();
-
-    using event_handler_t = void(const std::string& param, Rml::Event&);
-
-    void queue_event(const SDL_Event& event);
-    bool try_deque_event(SDL_Event& out);
-
-    std::unique_ptr<UiEventListenerInstancer> make_event_listener_instancer();
-    void register_event(UiEventListenerInstancer& listener, const std::string& name, event_handler_t* handler);
-
-    void show_context(ContextId context, std::string_view param);
-    void hide_context(ContextId context);
-    void hide_all_contexts();
-    bool is_context_shown(ContextId context);
-    bool is_context_capturing_input();
-    bool is_context_capturing_mouse();
-    bool is_any_context_shown();
-    ContextId try_close_current_context();
-
-    ContextId get_launcher_context_id();
-    ContextId get_config_context_id();
-    ContextId get_config_sub_menu_context_id();
-
-    enum class ConfigTab {
-        General,
-        Controls,
-        Graphics,
-        Sound,
-        Mods,
-        Debug,
-    };
-
-    void set_config_tab(ConfigTab tab);
-    int config_tab_to_index(ConfigTab tab);
-    Rml::ElementTabSet* get_config_tabset();
-    Rml::Element* get_mod_tab();
-    void set_config_tabset_mod_nav();
-    void focus_mod_configure_button();
-
-    void init_styling(const std::filesystem::path& rcss_file);
-    void init_prompt_context();
-    void open_choice_prompt(
-        const std::string& header_text,
-        const std::string& content_text,
-        const std::string& confirm_label_text,
-        const std::string& cancel_label_text,
-        std::function<void()> confirm_action,
-        std::function<void()> cancel_action,
-        ButtonStyle confirm_variant = ButtonStyle::Success,
-        ButtonStyle cancel_variant = ButtonStyle::Danger,
-        bool focus_on_cancel = true,
-        const std::string& return_element_id = ""
-    );
-    void open_info_prompt(
-        const std::string& header_text,
-        const std::string& content_text,
-        const std::string& okay_label_text,
-        std::function<void()> okay_action,
-        ButtonStyle okay_variant = ButtonStyle::Danger,
-        const std::string& return_element_id = ""
-    );
-    void open_notification(
-        const std::string& header_text,
-        const std::string& content_text,
-        const std::string& return_element_id = ""
-    );
-    void close_prompt();
-    bool is_prompt_open();
-    void update_mod_list(bool scan_mods = true);
-    void process_game_started();
-
-    void apply_color_hack();
-    void get_window_size(int& width, int& height);
-    void set_cursor_visible(bool visible);
-    void update_supported_options();
-    void toggle_fullscreen();
-
-    bool get_cont_active(void);
-    void set_cont_active(bool active);
-    void activate_mouse();
-
-    void message_box(const char* msg);
-
-    void set_render_hooks();
-
-    Rml::ElementPtr create_custom_element(Rml::Element* parent, std::string tag);
-    Rml::ElementDocument* load_document(const std::filesystem::path& path);
-    Rml::ElementDocument* create_empty_document();
-    Rml::Element* get_child_by_tag(Rml::Element* parent, const std::string& tag);
-
-    void queue_image_from_bytes_rgba32(const std::string &src, const std::vector<char> &bytes, uint32_t width, uint32_t height);
-    void queue_image_from_bytes_file(const std::string &src, const std::vector<char> &bytes);
-    void release_image(const std::string &src);
-
-    void drop_files(const std::list<std::filesystem::path> &file_list);
-}
-
-#endif

launch.vs.json

@@ -7,7 +7,8 @@
       "project": "CMakeLists.txt",
       "projectTarget": "BanjoRecompiled.exe",
       "name": "BanjoRecompiled.exe",
-      "currentDir": "${workspaceRoot}"
+      "currentDir": "${workspaceRoot}",
+      "args": ["--show-console"]
     }
   ]
 }

lib/FindFreetype.cmake

@@ -1,9 +0,0 @@
-set(FREETYPE_INCLUDE_DIRS ${CMAKE_SOURCE_DIR}/lib/freetype-windows-binaries/include)
-set(FREETYPE_LIBRARIES "${CMAKE_SOURCE_DIR}/lib/freetype-windows-binaries/release static/vs2015-2022/win64/freetype.lib")
-add_library(Freetype::Freetype STATIC IMPORTED)
-set_target_properties(Freetype::Freetype PROPERTIES
-	IMPORTED_LOCATION ${FREETYPE_LIBRARIES}
-)
-target_include_directories(Freetype::Freetype INTERFACE
-	${FREETYPE_INCLUDE_DIRS}
-)

lib/GamepadMotionHelpers/.gitignore

@@ -1,32 +0,0 @@
-# Prerequisites
-*.d
-
-# Compiled Object files
-*.slo
-*.lo
-*.o
-*.obj
-
-# Precompiled Headers
-*.gch
-*.pch
-
-# Compiled Dynamic libraries
-*.so
-*.dylib
-*.dll
-
-# Fortran module files
-*.mod
-*.smod
-
-# Compiled Static libraries
-*.lai
-*.la
-*.a
-*.lib
-
-# Executables
-*.exe
-*.out
-*.app

lib/GamepadMotionHelpers/CMakeLists.txt

@@ -1,11 +0,0 @@
-cmake_minimum_required(VERSION 3.8)
-
-project(GamepadMotionHelpers LANGUAGES CXX)
-
-add_library(${PROJECT_NAME} INTERFACE)
-add_library(${PROJECT_NAME}::${PROJECT_NAME} ALIAS ${PROJECT_NAME})
-target_include_directories(${PROJECT_NAME}
-        INTERFACE
-            $<BUILD_INTERFACE:${CMAKE_CURRENT_SOURCE_DIR}>
-            $<INSTALL_INTERFACE:include>)
-