diff --git a/packages/broadcast-panel/src/components/NewTransmissionModal.tsx b/packages/broadcast-panel/src/components/NewTransmissionModal.tsx
index 1ec0aec..c2b44ba 100644
--- a/packages/broadcast-panel/src/components/NewTransmissionModal.tsx
+++ b/packages/broadcast-panel/src/components/NewTransmissionModal.tsx
@@ -19,7 +19,7 @@ import { FaYoutube, FaFacebook, FaLinkedin, FaTwitch, FaInstagram, FaKickstarter
 import { FaXTwitter } from 'react-icons/fa6'
 import { BsInfoCircle } from 'react-icons/bs'
 import styles from './NewTransmissionModal.module.css'
-import type { Transmission } from '../types'
+import type { Transmission } from '@shared/types'
 
 interface Props {
   open: boolean
diff --git a/packages/broadcast-panel/src/components/PageContainer.tsx b/packages/broadcast-panel/src/components/PageContainer.tsx
index 389e0b4..36eae1b 100644
--- a/packages/broadcast-panel/src/components/PageContainer.tsx
+++ b/packages/broadcast-panel/src/components/PageContainer.tsx
@@ -9,7 +9,7 @@ import Header from './Header'
 import TransmissionsTable from './TransmissionsTable'
 import { NewTransmissionModal } from '@shared/components'
 import Studio from './Studio'
-import type { Transmission } from '../types'
+import type { Transmission } from '@shared/types'
 
 const STORAGE_KEY = 'broadcast_transmissions'
 
diff --git a/packages/broadcast-panel/src/components/TransmissionsTable.tsx b/packages/broadcast-panel/src/components/TransmissionsTable.tsx
index d6af868..775f13e 100644
--- a/packages/broadcast-panel/src/components/TransmissionsTable.tsx
+++ b/packages/broadcast-panel/src/components/TransmissionsTable.tsx
@@ -6,7 +6,7 @@ import { SkeletonTable } from './Skeleton'
 import styles from './TransmissionsTable.module.css'
 import InviteGuestsModal from './InviteGuestsModal'
 import { NewTransmissionModal } from '@shared/components'
-import type { Transmission } from '../types'
+import type { Transmission } from '@shared/types'
 
 interface Props {
   transmissions: Transmission[]
diff --git a/packages/broadcast-panel/tsconfig.json b/packages/broadcast-panel/tsconfig.json
index e5f85ff..446549f 100644
--- a/packages/broadcast-panel/tsconfig.json
+++ b/packages/broadcast-panel/tsconfig.json
@@ -1,6 +1,8 @@
 {
   "extends": "../../tsconfig.json",
   "compilerOptions": {
+    "ignoreDeprecations": "6.0",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
     "outDir": "dist",
     "tsBuildInfoFile": "node_modules/.cache/broadcast-panel.tsbuildinfo",
     "baseUrl": "../..",
diff --git a/packages/studio-panel/src/hooks/useAssets.ts b/packages/studio-panel/src/hooks/useAssets.ts
index 6b2bf3c..a53b702 100644
--- a/packages/studio-panel/src/hooks/useAssets.ts
+++ b/packages/studio-panel/src/hooks/useAssets.ts
@@ -1,6 +1,5 @@
 import { useState, useEffect } from 'react'
-
-export type Asset = { id: string; name: string; type: 'image' | 'video' }
+import type { Asset } from '@shared/types'
 
 export function useAssets() {
   const [assets, setAssets] = useState<Asset[]>([])
diff --git a/packages/studio-panel/src/hooks/useChat.ts b/packages/studio-panel/src/hooks/useChat.ts
index 46b4a3c..e7a64bf 100644
--- a/packages/studio-panel/src/hooks/useChat.ts
+++ b/packages/studio-panel/src/hooks/useChat.ts
@@ -1,6 +1,5 @@
 import { useState, useEffect } from 'react'
-
-export type ChatMessage = { id: string; user: string; text: string }
+import type { ChatMessage } from '@shared/types'
 
 export function useChat() {
   const [messages, setMessages] = useState<ChatMessage[]>([])
diff --git a/packages/studio-panel/src/hooks/usePeople.ts b/packages/studio-panel/src/hooks/usePeople.ts
index f69af92..3867b43 100644
--- a/packages/studio-panel/src/hooks/usePeople.ts
+++ b/packages/studio-panel/src/hooks/usePeople.ts
@@ -1,6 +1,5 @@
 import { useState, useEffect } from 'react'
-
-export type Person = { id: string; name: string; role?: string }
+import type { Person } from '@shared/types'
 
 export function usePeople() {
   const [people, setPeople] = useState<Person[]>([])
diff --git a/packages/studio-panel/src/hooks/useScene.ts b/packages/studio-panel/src/hooks/useScene.ts
index c101cb9..a620d25 100644
--- a/packages/studio-panel/src/hooks/useScene.ts
+++ b/packages/studio-panel/src/hooks/useScene.ts
@@ -1,6 +1,6 @@
 // Hook minimal de ejemplo para exponer la escena (interface ligera)
 import { useState } from 'react'
-import type { SceneConfig } from '../types'
+import type { SceneConfig } from '@shared/types'
 
 export function useScene() {
   const [sceneConfig, setSceneConfig] = useState<SceneConfig>({
diff --git a/packages/studio-panel/src/hooks/useStyle.ts b/packages/studio-panel/src/hooks/useStyle.ts
index aef8f9f..e4d3910 100644
--- a/packages/studio-panel/src/hooks/useStyle.ts
+++ b/packages/studio-panel/src/hooks/useStyle.ts
@@ -1,6 +1,5 @@
 import { useState } from 'react'
-
-export type StyleConfig = { themeColor: string; showLogo: boolean }
+import type { StyleConfig } from '@shared/types'
 
 export function useStyle() {
   const [style, setStyle] = useState<StyleConfig>({ themeColor: '#2563eb', showLogo: true })
diff --git a/shared/components/NewTransmissionModal.tsx b/shared/components/NewTransmissionModal.tsx
index 370bde7..071b35a 100644
--- a/shared/components/NewTransmissionModal.tsx
+++ b/shared/components/NewTransmissionModal.tsx
@@ -19,7 +19,7 @@ import { FaYoutube, FaFacebook, FaLinkedin, FaTwitch, FaInstagram, FaKickstarter
 import { FaXTwitter } from 'react-icons/fa6'
 import { BsInfoCircle } from 'react-icons/bs'
 import styles from './NewTransmissionModal.module.css'
-import type { Transmission, Destination } from '../types'
+import type { Transmission, Destination } from '@shared/types'
 
 interface Props {
   open: boolean
diff --git a/shared/types/index.ts b/shared/types/index.ts
index 846b443..e958b79 100644
--- a/shared/types/index.ts
+++ b/shared/types/index.ts
@@ -1,3 +1,5 @@
+/// <reference path="../../types/media.d.ts" />
+
 export interface Transmission {
   id: string
   title: string
@@ -158,6 +160,35 @@ export interface BackgroundSource {
   value: string;
 }
 
+// SceneConfig moved from studio-panel to shared types
+export type ParticipantLayoutType = 'single_speaker' | 'side_by_side' | 'grid_4' | 'grid_6' | 'focus_side' | 'presentation'
+
+export type MediaSourceType =
+  | { type: 'screen'; stream: MediaStream }
+  | { type: 'file'; url: string }
+  | null
+
+// Lightweight common types moved from studio-panel hooks
+export type Asset = { id: string; name: string; type: 'image' | 'video' }
+
+export type Person = { id: string; name: string; role?: string }
+
+export type StyleConfig = { themeColor: string; showLogo: boolean }
+
+export type ChatMessage = { id: string; user: string; text: string }
+
+export type OverlayConfig = {
+  showLogo: boolean
+  showLowerThird: boolean
+  lowerThirdText?: string
+}
+
+export type SceneConfig = {
+  participantLayout: ParticipantLayoutType
+  mediaSource: MediaSourceType
+  overlays: OverlayConfig
+}
+
 // Guest types
 export interface Guest {
   id: string;
diff --git a/tsconfig.json b/tsconfig.json
index ee31f93..3389970 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "ignoreDeprecations": "6.0",
     "target": "ES2021",
     "useDefineForClassFields": true,
     "lib": ["DOM", "ESNext"],
diff --git a/types/media.d.ts b/types/media.d.ts
new file mode 100644
index 0000000..3ce5d6a
--- /dev/null
+++ b/types/media.d.ts
@@ -0,0 +1,11 @@
+// Minimal MediaStream shim so packages can compile in isolated container environments
+// This avoids requiring the full DOM lib in every package tsconfig.
+declare global {
+  // Keep minimal surface area — expand if you rely on more MediaStream APIs
+  interface MediaStream {
+    id?: string
+    getTracks?: () => any[]
+  }
+}
+
+export {}