전체적인 여백 간격 변경

src/lib/components/BottomSheet.svelte

@@ -25,7 +25,7 @@
       <AdaptiveDiv>
         <div
           onclick={(e) => e.stopPropagation()}
-          class="flex max-h-[70vh] min-h-[30vh] w-full items-stretch rounded-t-2xl bg-white p-4"
+          class="flex max-h-[70vh] min-h-[30vh] w-full items-stretch rounded-t-2xl bg-white px-4"
           transition:fly={{ y: 100, duration: 200 }}
         >
           {@render children?.()}

src/lib/components/Modal.svelte

@@ -24,7 +24,7 @@
   <!-- svelte-ignore a11y_no_static_element_interactions -->
   <div
     onclick={closeModal}
-    class="fixed inset-0 z-10 bg-black bg-opacity-50 px-2"
+    class="fixed inset-0 z-10 bg-black bg-opacity-50 px-4"
     transition:fade={{ duration: 100 }}
   >
     <AdaptiveDiv>

src/lib/components/TopBar.svelte

@@ -21,7 +21,7 @@
     <IconArrowBack class="text-2xl" />
   </button>
   {#if title}
-    <p class="absolute left-1/2 -translate-x-1/2 transform text-xl font-semibold">{title}</p>
+    <p class="absolute left-1/2 -translate-x-1/2 transform text-lg font-semibold">{title}</p>
   {/if}
   {#if children}
     {@render children?.()}

src/lib/components/divs/BottomDiv.svelte

@@ -2,6 +2,6 @@
   let { children } = $props();
 </script>
 
-<div class="sticky bottom-0 flex w-full flex-col items-center gap-y-2 bg-white pb-2">
+<div class="sticky bottom-0 flex w-full flex-col items-center gap-y-2 bg-white pb-4">
   {@render children?.()}
 </div>

src/lib/components/divs/TitleDiv.svelte

@@ -11,7 +11,7 @@
 </script>
 
 <div>
-  <div class="box-content flex min-h-[10vh] items-center pt-2">
+  <div class="box-content flex min-h-[10vh] items-center pt-4">
     {#if Icon}
       <Icon class="text-5xl text-gray-600" />
     {/if}

src/routes/(fullscreen)/+layout.svelte

@@ -5,7 +5,7 @@
 </script>
 
 <AdaptiveDiv>
-  <div class="flex h-screen w-full flex-col justify-between px-2">
+  <div class="flex h-screen w-full flex-col justify-between px-4">
     {@render children()}
   </div>
 </AdaptiveDiv>

src/routes/(fullscreen)/key/export/BeforeContinueBottomSheet.svelte

@@ -13,7 +13,7 @@
 </script>
 
 <BottomSheet bind:isOpen>
-  <div class="flex flex-col justify-between space-y-4">
+  <div class="flex flex-col justify-between space-y-4 pt-4">
     <div class="space-y-2">
       <p class="break-keep text-xl font-bold">암호 키 파일을 저장하셨나요?</p>
       <p class="break-keep">

src/routes/(fullscreen)/key/export/BeforeContinueModal.svelte

@@ -11,7 +11,7 @@
 </script>
 
 <Modal bind:isOpen>
-  <div class="space-y-4 px-1">
+  <div class="space-y-4">
     <div class="space-y-2">
       <p class="break-keep text-xl font-bold">내보내지 않고 계속할까요?</p>
       <p class="break-keep">암호 키 파일은 유출 방지를 위해 이 화면에서만 저장할 수 있어요.</p>

src/routes/(main)/BottomBar.svelte

@@ -23,7 +23,7 @@
   class="sticky bottom-0 h-20 w-full flex-shrink-0 rounded-t-2xl border-t border-gray-300 bg-white"
 >
   <AdaptiveDiv>
-    <div class="flex w-full justify-evenly p-2">
+    <div class="flex w-full justify-evenly px-4 py-2">
       {#each pages as { path, label, icon: Icon }}
         {@const textColor = !page.url.pathname.startsWith(path) ? "text-gray-600" : ""}
         <button class="w-16 active:rounded-xl active:bg-gray-100 {textColor}">