fix: center header content with symmetric padding

Use pt-3 pb-3 (12px each) for symmetric vertical padding so content
is visually centered in every header bar.

To keep headers draggable, each header container gets the drag-region
class and all interactive elements (buttons) get the no-drag class.
The global fallback drag strip is reduced to h-3.
Title bar overlay reduced from 40px to 32px (standard Windows size).

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

src/renderer/components/PatternEditor.tsx

@@ -225,10 +225,10 @@ export function PatternEditor({
   return (
     <div className="flex h-full flex-col">
       {/* Header — consistent ← navigation */}
-      <div className="flex items-center justify-between border-b border-[var(--color-border)] px-5 pb-3 pt-12">
+      <div className="drag-region flex items-center justify-between border-b border-[var(--color-border)] px-5 pb-3 pt-3">
         <div className="flex items-center gap-3">
           <button
-            className="flex size-8 items-center justify-center rounded-lg text-zinc-400 transition hover:bg-zinc-800 hover:text-zinc-200"
+            className="no-drag flex size-8 items-center justify-center rounded-lg text-zinc-400 transition hover:bg-zinc-800 hover:text-zinc-200"
             onClick={onBack}
             type="button"
           >
@@ -243,7 +243,7 @@ export function PatternEditor({
             </p>
           </div>
         </div>
-        <div className="flex items-center gap-2">
+        <div className="no-drag flex items-center gap-2">
           {!isBuiltin && onDelete && (
             <button
               className="flex items-center gap-1.5 rounded-lg px-3 py-1.5 text-[13px] text-red-400 transition hover:bg-red-500/10"