fix(ui): fix minor ui bugs

src/pages/student/Home.tsx

@@ -400,7 +400,7 @@ export const Home = () => {
         : "Good evening";
 
   return (
-    <div className="home-screen">
+    <div className="home-screen pb-12">
       <style>{STYLES}</style>
 
       {/* Blobs */}

src/pages/student/Lessons.tsx

@@ -221,7 +221,7 @@ export const Lessons = () => {
   };
 
   return (
-    <div className="ls-screen">
+    <div className="ls-screen pb-12">
       <style>{STYLES}</style>
 
       {/* Blobs */}

src/pages/student/Practice.tsx

@@ -243,7 +243,7 @@ export const Practice = () => {
   const userXp = useExamConfigStore.getState().userXp;
 
   return (
-    <div className="pr-screen">
+    <div className="pr-screen pb-12">
       <style>{STYLES}</style>
 
       {/* Blobs */}

src/pages/student/Profile.tsx

@@ -232,7 +232,7 @@ export const Profile = () => {
   ];
 
   return (
-    <div className="pf-screen">
+    <div className="pf-screen pb-12">
       <style>{STYLES}</style>
 
       {/* Blobs */}

src/pages/student/StudentLayout.tsx

@@ -137,7 +137,7 @@ export function StudentLayout() {
         <div className="flex flex-col flex-1 min-w-0">
           <SidebarTrigger className="hidden md:block" />
           {/* Extra bottom padding so content clears the floating dock */}
-          <main className="flex-1 pb-32 md:pb-0">
+          <main className="flex-1 md:pb-0">
             <Outlet />
           </main>
         </div>

src/pages/student/practice/Test.tsx

@@ -539,17 +539,6 @@ const Confetti = ({ active }: { active: boolean }) => {
   );
 };
 
-const snapPoints = [
-  "190px",
-  "250px",
-  "300px",
-  "350px",
-  "400px",
-  "500px",
-  "600px",
-  "700px",
-];
-
 // ─── XP Popup Component ───────────────────────────────────────────────────────
 const XPPopup = ({ xp, show }: { xp: number; show: boolean }) => {
   if (!show) return null;
@@ -636,8 +625,6 @@ export const Test = () => {
   const quitExam = useSatExam((s) => s.quitExam);
   const setResults = useResults((s) => s.setResults);
 
-  const [snap, setSnap] = useState<number | string | null>(snapPoints[0]);
-
   const startExam = async () => {
     console.log("startExam called", { user, sheetId });
     if (!user) {
@@ -1433,7 +1420,7 @@ export const Test = () => {
           {isMCQ && (
             <Drawer.Root
               modal={false}
-              snapPoints={[0.35, 0.6, 0.85]}
+              snapPoints={[0.35, 0.6, 0.95]}
               defaultOpen={true}
             >
               <Drawer.Portal>
@@ -1451,7 +1438,7 @@ export const Test = () => {
                   </Drawer.Title>
 
                   {/* Scrollable options */}
-                  <div className="flex-1 overflow-y-auto px-5 pb-8">
+                  <div className="flex-1 overflow-y-auto px-5 pb-40">
                     {renderOptions(currentQuestion)}
                   </div>
                 </Drawer.Content>