Update API to use safe settings config method

app/controllers/api/v1/settings_controller.rb

@@ -5,7 +5,7 @@ class Api::V1::SettingsController < ApiController
 
   def index
     render json: {
-      settings: current_api_user.settings,
+      settings: current_api_user.safe_settings.config,
       status: 'success'
     }, status: :ok
   end

app/javascript/controllers/maps/maplibre/layer_manager.js

@@ -93,23 +93,17 @@ export class LayerManager {
       this.map.getCanvas().style.cursor = ''
     })
     // Areas hover handlers for all sub-layers
-    this.map.on('mouseenter', 'areas-fill', () => {
-      this.map.getCanvas().style.cursor = 'pointer'
-    })
-    this.map.on('mouseleave', 'areas-fill', () => {
-      this.map.getCanvas().style.cursor = ''
-    })
-    this.map.on('mouseenter', 'areas-outline', () => {
-      this.map.getCanvas().style.cursor = 'pointer'
-    })
-    this.map.on('mouseleave', 'areas-outline', () => {
-      this.map.getCanvas().style.cursor = ''
-    })
-    this.map.on('mouseenter', 'areas-labels', () => {
-      this.map.getCanvas().style.cursor = 'pointer'
-    })
-    this.map.on('mouseleave', 'areas-labels', () => {
-      this.map.getCanvas().style.cursor = ''
+    const areaLayers = ['areas-fill', 'areas-outline', 'areas-labels']
+    areaLayers.forEach(layerId => {
+      // Only add handlers if layer exists
+      if (this.map.getLayer(layerId)) {
+        this.map.on('mouseenter', layerId, () => {
+          this.map.getCanvas().style.cursor = 'pointer'
+        })
+        this.map.on('mouseleave', layerId, () => {
+          this.map.getCanvas().style.cursor = ''
+        })
+      }
     })
   }
 

app/services/users/safe_settings.rb

@@ -28,7 +28,7 @@ class Users::SafeSettings
   end
 
   # rubocop:disable Metrics/MethodLength
-  def default_settings
+  def config
     {
       fog_of_war_meters: fog_of_war_meters,
       meters_between_routes: meters_between_routes,

app/views/maps/maplibre/_settings_panel.html.erb

@@ -527,8 +527,8 @@
       <!-- Tools Tab -->
       <div class="tab-content" data-tab-content="tools" data-map-panel-target="tabContent">
         <div class="space-y-4">
-          <!-- Tools Grid: 2 columns on md+ screens, 1 column on smaller screens -->
-          <div class="grid grid-cols-1 md:grid-cols-2 gap-3">
+          <!-- Tools Grid: Full width on mobile/tablet, 2 columns on large screens -->
+          <div class="grid grid-cols-1 lg:grid-cols-2 gap-3">
             <!-- Create a Visit Button -->
             <button type="button"
                     class="btn btn-sm btn-outline"

spec/services/users/safe_settings_spec.rb

@@ -3,13 +3,13 @@
 require 'rails_helper'
 
 RSpec.describe Users::SafeSettings do
-  describe '#default_settings' do
+  describe '#config' do
     context 'with default values' do
       let(:settings) { {} }
       let(:safe_settings) { described_class.new(settings) }
 
       it 'returns default configuration' do
-        expect(safe_settings.default_settings).to eq(
+        expect(safe_settings.config).to eq(
           {
             fog_of_war_meters: 50,
             meters_between_routes: 500,
@@ -84,8 +84,8 @@ RSpec.describe Users::SafeSettings do
         )
       end
 
-      it 'returns custom default_settings configuration' do
-        expect(safe_settings.default_settings).to eq(
+      it 'returns custom config configuration' do
+        expect(safe_settings.config).to eq(
           {
             fog_of_war_meters: 100,
             meters_between_routes: 1000,