룰렛 설정 입력 가시성과 프로필 메뉴 레이아웃 개선

룰렛 설정에서 입력 필드 포커스 시 항목을 중앙으로 이동한다.
키보드에 가려지지 않도록 입력 가시성을 높인다.
프로필 메뉴 오버레이의 하단 안전영역 패딩을 제거한다.

SodaLive/Sources/Live/Room/Routlette/Config/RouletteSettingsView.swift

@@ -7,10 +7,17 @@
 
 import SwiftUI
 
+enum RouletteSettingsFocusField: Hashable {
+    case canAmount
+    case optionTitle(UUID)
+    case optionPercentage(UUID)
+}
+
 struct RouletteSettingsView: View {
     
     @StateObject var keyboardHandler = KeyboardHandler()
     @StateObject var viewModel = RouletteSettingsViewModel()
+    @FocusState private var focusedField: RouletteSettingsFocusField?
     
     @Binding var isShowing: Bool
     
@@ -25,8 +32,9 @@ struct RouletteSettingsView: View {
                         isShowing = false
                     }
                     
-                    ScrollView(.vertical, showsIndicators: false) {
-                        VStack(spacing: 0) {
+                    ScrollViewReader { scrollProxy in
+                        ScrollView(.vertical, showsIndicators: false) {
+                            VStack(spacing: 0) {
                             HStack(spacing: 13.3) {
                                 SelectedButtonView(
                                     title: I18n.Common.roulette1,
@@ -100,6 +108,7 @@ struct RouletteSettingsView: View {
                                     .appFont(size: 13.3, weight: .medium)
                                     .foregroundColor(Color.grayee)
                                     .keyboardType(.numberPad)
+                                    .focused($focusedField, equals: .canAmount)
                                     .padding(.horizontal, 13.3)
                                     .padding(.vertical, 16.7)
                                     .frame(maxWidth: .infinity)
@@ -114,6 +123,7 @@ struct RouletteSettingsView: View {
                                 }
                             }
                             .padding(.top, 26.7)
+                            .id("roulette_can_input")
                             
                             VStack(alignment: .leading, spacing: 21.3) {
                                 Text("룰렛 옵션 설정")
@@ -146,20 +156,31 @@ struct RouletteSettingsView: View {
                             }
                             .padding(.top, 21.3)
                             
-                            LazyVStack(spacing: 21.3) {
-                                ForEach(viewModel.options.indices, id: \.self) { index in
+                            VStack(spacing: 21.3) {
+                                ForEach(Array(viewModel.options.enumerated()), id: \.element.id) { index, option in
                                     RouletteSettingsOptionView(
-                                        option: viewModel.options[index],
+                                        option: option,
                                         index: index,
+                                        focusedField: $focusedField,
                                         onClickDelete: { viewModel.deleteOption(index: index) },
                                         calculateTotalPercentage: { viewModel.calculateTotalPercentage() }
                                     )
+                                    .id(option.id)
                                 }
                             }
                             .padding(.top, 21.3)
                         }
                         .padding(.horizontal, 13.3)
                         .padding(.bottom, keyboardHandler.keyboardHeight)
+                        .onChange(of: focusedField) { _ in
+                            scrollToFocusedField(scrollProxy: scrollProxy)
+                        }
+                        .onChange(of: keyboardHandler.keyboardHeight) { height in
+                            if height > 0, focusedField != nil {
+                                scrollToFocusedField(scrollProxy: scrollProxy)
+                            }
+                        }
+                    }
                     }
                     
                     Spacer()
@@ -204,6 +225,7 @@ struct RouletteSettingsView: View {
                     }
                 }
                 .onTapGesture {
+                    focusedField = nil
                     hideKeyboard()
                 }
                 
@@ -240,6 +262,19 @@ struct RouletteSettingsView: View {
             }
         }
     }
+    
+    private func scrollToFocusedField(scrollProxy: ScrollViewProxy) {
+        guard let focusedField else { return }
+        
+        withAnimation(.easeOut(duration: 0.2)) {
+            switch focusedField {
+            case .canAmount:
+                scrollProxy.scrollTo("roulette_can_input", anchor: .center)
+            case .optionTitle(let id), .optionPercentage(let id):
+                scrollProxy.scrollTo(id, anchor: .center)
+            }
+        }
+    }
 }
 
 struct RouletteSettingsView_Previews: PreviewProvider {