feat: match the Security masthead to the primary-page hero and make History search realtime (#1365)

- Masthead: add `size` and `subtitle` to PageMasthead and render the Security
  masthead at the hero title size with a one-line posture summary, so its height
  and weight match the Home and Fleet mastheads. The compact size with no
  subtitle stays the default, so Settings, Console, and Logs are unchanged.
- History search now applies as you type (a short debounce, no Enter press),
  matching the Fleet overview search. It stays server-side so the query searches
  every completed scan, not just the loaded page.

frontend/src/components/ui/PageMasthead.tsx

@@ -15,8 +15,16 @@ export interface PageMastheadProps {
     tone: MastheadTone;
     pulsing?: boolean;
     metadata?: MastheadMetadataItem[];
+    /** Optional meta line under the state word (e.g. a one-line posture summary). */
+    subtitle?: ReactNode;
     children?: ReactNode;
     className?: string;
+    /**
+     * `hero` matches the larger title of the primary nav pages (Home, Fleet);
+     * `default` is the compact title used by the secondary tool pages (Settings,
+     * Console, Logs).
+     */
+    size?: 'default' | 'hero';
 }
 
 const toneConfig: Record<MastheadTone, {
@@ -59,8 +67,10 @@ export function PageMasthead({
     tone,
     pulsing = false,
     metadata,
+    subtitle,
     children,
     className,
+    size = 'default',
 }: PageMastheadProps) {
     const config = toneConfig[tone];
     const shouldPulse = pulsing && (tone === 'live' || tone === 'warn');
@@ -88,9 +98,20 @@ export function PageMasthead({
                         <span className="font-mono text-[10px] leading-3 uppercase tracking-[0.18em] text-stat-subtitle">
                             {kicker}
                         </span>
-                        <span className={cn('font-display italic text-[22px] leading-7 tracking-[-0.01em]', config.stateTextClass)}>
+                        <span
+                            className={cn(
+                                'font-display italic tracking-[-0.01em]',
+                                size === 'hero' ? 'text-3xl leading-none' : 'text-[22px] leading-7',
+                                config.stateTextClass,
+                            )}
+                        >
                             {state}
                         </span>
+                        {subtitle ? (
+                            <span className="font-mono text-[11px] leading-tight text-stat-subtitle/90 truncate">
+                                {subtitle}
+                            </span>
+                        ) : null}
                     </div>
                     {children ? <div className="ml-2 min-w-0">{children}</div> : null}
                 </div>