fix: various fixes

fixes various errors and warning

app/components/chat/BaseChat.tsx

@@ -72,7 +72,7 @@ export const BaseChat = React.forwardRef<HTMLDivElement, BaseChatProps>(
         <div ref={scrollRef} className="flex overflow-y-auto w-full h-full">
           <div className={classNames(styles.Chat, 'flex flex-col flex-grow min-w-[var(--chat-min-width)] h-full')}>
             {!chatStarted && (
-              <div id="intro" className="mt-[26vh] max-w-chat mx-auto">
+              <div id="intro" className="mt-[20vh] max-w-chat mx-auto">
                 <h1 className="text-5xl text-center font-bold text-bolt-elements-textPrimary mb-2">
                   Where ideas begin
                 </h1>

app/styles/components/resize-handle.scss

@@ -1,3 +1,5 @@
+@use '../z-index' as *;
+
 [data-resize-handle] {
   position: relative;
 

app/styles/index.scss

@@ -1,11 +1,11 @@
-@import './variables.scss';
-@import './z-index.scss';
-@import './animations.scss';
-@import './components/terminal.scss';
-@import './components/resize-handle.scss';
-@import './components/code.scss';
-@import './components/editor.scss';
-@import './components/toast.scss';
+@use './variables' as *;
+@use './z-index' as *;
+@use './animations' as *;
+@use './components/terminal';
+@use './components/resize-handle';
+@use './components/code';
+@use './components/editor';
+@use './components/toast';
 
 html,
 body {

vite.config.ts

@@ -20,6 +20,7 @@ export default defineConfig((config) => {
           v3_fetcherPersist: true,
           v3_relativeSplatPath: true,
           v3_throwAbortReason: true,
+          v3_lazyRouteDiscovery: true
         },
       }),
       UnoCSS(),
@@ -27,6 +28,13 @@ export default defineConfig((config) => {
       chrome129IssuePlugin(),
       config.mode === 'production' && optimizeCssModules({ apply: 'build' }),
     ],
+    css: {
+      preprocessorOptions: {
+        scss: {
+          api: 'modern-compiler'
+        }
+      }
+    }
   };
 });