diff --git a/apps/web/src/pages/editing-planner/components/PipConfigPanel/components/LayerConfig.tsx b/apps/web/src/pages/editing-planner/components/PipConfigPanel/components/LayerConfig.tsx
index e7380aa02..900111299 100644
--- a/apps/web/src/pages/editing-planner/components/PipConfigPanel/components/LayerConfig.tsx
+++ b/apps/web/src/pages/editing-planner/components/PipConfigPanel/components/LayerConfig.tsx
@@ -117,7 +117,10 @@ export const LayerConfig: React.FC<LayerConfigProps> = ({
             min={10}
             max={80}
             value={layer.width}
-            onChange={(e) => onWidthChange(Number(e.target.value))}
+            onChange={(e) => {
+              const val = Number(e.target.value)
+              if (!isNaN(val)) onWidthChange(val)
+            }}
           />
           <span className="pip-slider-value">{layer.width}%</span>
         </div>
@@ -129,7 +132,10 @@ export const LayerConfig: React.FC<LayerConfigProps> = ({
             min={10}
             max={80}
             value={layer.height}
-            onChange={(e) => onHeightChange(Number(e.target.value))}
+            onChange={(e) => {
+              const val = Number(e.target.value)
+              if (!isNaN(val)) onHeightChange(val)
+            }}
           />
           <span className="pip-slider-value">{layer.height}%</span>
         </div>
@@ -153,7 +159,10 @@ export const LayerConfig: React.FC<LayerConfigProps> = ({
             min={0}
             max={50}
             value={layer.border_radius}
-            onChange={(e) => onUpdate(layer.id, { border_radius: Number(e.target.value) })}
+            onChange={(e) => {
+              const val = Number(e.target.value)
+              if (!isNaN(val)) onUpdate(layer.id, { border_radius: val })
+            }}
           />
           <span className="pip-slider-value">{layer.border_radius}%</span>
         </div>
@@ -169,7 +178,10 @@ export const LayerConfig: React.FC<LayerConfigProps> = ({
             min={0}
             max={100}
             value={layer.opacity}
-            onChange={(e) => onUpdate(layer.id, { opacity: Number(e.target.value) })}
+            onChange={(e) => {
+              const val = Number(e.target.value)
+              if (!isNaN(val)) onUpdate(layer.id, { opacity: val })
+            }}
           />
           <span className="pip-slider-value">{layer.opacity}%</span>
         </div>
@@ -188,7 +200,10 @@ export const LayerConfig: React.FC<LayerConfigProps> = ({
               max={totalDuration || 999}
               step={0.1}
               value={layer.start_time}
-              onChange={(e) => onUpdate(layer.id, { start_time: Number(e.target.value) })}
+              onChange={(e) => {
+                const val = Number(e.target.value)
+                if (!isNaN(val)) onUpdate(layer.id, { start_time: val })
+              }}
             />
           </div>
           <div>
@@ -200,7 +215,10 @@ export const LayerConfig: React.FC<LayerConfigProps> = ({
               max={totalDuration || 999}
               step={0.1}
               value={layer.duration}
-              onChange={(e) => onUpdate(layer.id, { duration: Number(e.target.value) })}
+              onChange={(e) => {
+                const val = Number(e.target.value)
+                if (!isNaN(val)) onUpdate(layer.id, { duration: val })
+              }}
             />
           </div>
         </div>