:root { --bg:#131313; --surface:#201f1f; --surface-2:#2a2a2a; --surface-3:#353534;
  --text:#e5e2e1; --muted:#c2c6d6; --faint:#8c909f; --border:#424754;
  --accent:#4d8eff; --accent-bg:#1b3158; --ok:#10b981; --ok-bg:#143126;
  --err:#ff6b72; --err-bg:#35171c; --warn:#ffbd59; --warn-bg:#332812;
  --retazo:#ff846d; --retazo-bg:#321c1b; --radius:8px; --sidebar:244px;
  --font-ui:"DM Sans","Segoe UI",sans-serif; --font-display:"DM Sans","Segoe UI",sans-serif;
  --font-mono:var(--font-ui); --font-technical:"JetBrains Mono",monospace; }
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font-family:var(--font-ui); font-size:14px; font-weight:400; line-height:1.45;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
a { color: var(--accent); text-decoration: none; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:256px minmax(0,1fr); }
.app-shell:has(.project-sidebar) { grid-template-columns:256px 256px minmax(0,1fr); }
.app-shell.library-mode { grid-template-columns:256px minmax(0,1fr); }
.sidebar { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; padding:18px 14px;
  background:#1e1e1e; border-right:1px solid #ffffff1a; z-index:20; }
.brand { display:flex; align-items:center; gap:10px; color:var(--text); padding:2px 0 30px; letter-spacing:.05em; }
.brand > span:last-child { display:flex; flex-direction:column; line-height:1.15; }
.brand small,.proyecto-mini small { color:var(--muted); font:11px/1.1 var(--font-mono); margin-top:1px; }
.logo { width: 32px; height: 32px; border-radius: 4px; background: var(--accent);
  color: #00285d; display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 18px; }
.logo .material-symbols-outlined { font-size:18px; }.material-symbols-outlined { font-family:"Material Symbols Outlined"; font-weight:normal; font-style:normal; line-height:1; }
.nav-global,.nav-proyecto { display:grid; gap:4px; }
.nav-new { display:flex; align-items:center; justify-content:center; gap:6px; margin-bottom:20px; padding:10px; border-radius:8px; background:var(--accent); color:#00285d; font:13px var(--font-mono); }
.nav-new .material-symbols-outlined,.nav-item .material-symbols-outlined { font-size:18px; }
.nav-item { color:var(--muted); padding:10px 10px; border-radius:8px; display:flex; gap:10px; align-items:center; font:13px var(--font-mono); }
.nav-item:hover,.nav-item.activo { color:var(--text); background:var(--surface-2); }
.nav-item.activo { background:var(--accent); color:#00285d; font-weight:600; }
.nav-seccion { margin:22px 10px 8px; color:var(--faint); font-size:10px; font-weight:700; letter-spacing:.12em; }
.proyecto-mini { margin:0 4px 8px; padding:10px; background:var(--surface); border:1px solid var(--border); border-radius:8px; display:flex; flex-direction:column; }
.sidebar-spacer { flex:1; }.nav-footer { display:grid; gap:4px; padding-top:16px; border-top:1px solid #ffffff1a; }
.project-sidebar { position:sticky; top:0; height:100vh; background:#1e1e1e; border-right:1px solid #ffffff1a; }
.project-current { display:flex; flex-direction:column; height:140px; padding:26px 20px 18px; border-bottom:1px solid #ffffff1a; }.project-current > span,.workflow-label { color:#aeb8ff; font:11px var(--font-mono); }.project-current b { overflow:hidden; margin-top:8px; font-size:18px; font-weight:500; text-overflow:ellipsis; white-space:nowrap; }.project-current small { margin-top:8px; font:11px var(--font-mono); }.project-current small i { display:inline-block; width:8px; height:8px; margin-right:5px; border-radius:50%; background:var(--ok); }
.workflow-label { padding:18px 24px 8px; color:var(--muted); font-weight:700; }.project-flow { display:grid; gap:2px; padding:0 12px; }.project-flow a { display:grid; grid-template-columns:22px 1fr auto; align-items:center; gap:8px; padding:9px 12px; border-radius:8px; color:var(--muted); font:13px var(--font-mono); }.project-flow a .material-symbols-outlined { font-size:18px; }.project-flow a i { color:var(--ok); font-style:normal; }.project-flow a.activo { background:var(--surface-2); border:1px solid var(--border); color:#aeb8ff; }.project-flow a.activo i { color:#aeb8ff; }
.estado-local { margin-top:12px; padding:11px 10px; display:flex; gap:9px; align-items:center; border-top:1px solid var(--border); }
.estado-local > span { width:8px; height:8px; border-radius:50%; background:var(--ok); box-shadow:0 0 10px #38d99688; }
.estado-local div { display:flex; flex-direction:column; font-size:12px; }
.workspace { min-width:0; }
.topbar { height:64px; position:sticky; top:0; z-index:15; display:flex; justify-content:space-between; align-items:center;
  padding:0 24px; background:var(--bg); border-bottom:1px solid #ffffff1a; font-size:14px; }
.top-tabs { display:flex; gap:24px; height:100%; align-items:center; }.top-tabs a { color:var(--muted); }.top-tabs a.activo { color:#aeb8ff; border-bottom:2px solid #aeb8ff; height:100%; display:flex; align-items:center; }
.top-search { width:192px; position:relative; margin:0; }.top-search .material-symbols-outlined { position:absolute; left:9px; top:8px; color:var(--muted); font-size:17px; }.top-search input { padding-left:32px; background:var(--surface-2); }
.top-actions > .material-symbols-outlined,.top-actions > a.material-symbols-outlined { color:var(--muted); font-size:21px; }
.project-view-title { display:flex; align-items:center; gap:16px; }.project-view-title span { font:11px var(--font-mono); }.project-view-title b { font-size:24px; }.top-actions > i { width:1px; height:24px; background:#ffffff1a; }.icon-button { width:38px; height:38px; padding:0; border-radius:0; }.ai-button { height:38px; border:1px solid #7c86f6; border-radius:0; color:#b9c2ff; font:700 11px var(--font-ui); }
.source-brand { color:#aeb8ff; font-size:24px; font-weight:700; }.library-mode .topbar { justify-content:flex-start; gap:36px; }.library-mode .top-actions { margin-left:auto; }
.crumb { color:var(--faint); }.top-actions { display:flex; align-items:center; gap:12px; }.guardado { color:var(--ok); font-size:12px; }
.envoltura { max-width:none; margin:0; padding:32px 32px 80px; }
h1,h2,h3 { font-family:var(--font-display); color:var(--text); line-height:1.2; letter-spacing:-.018em; }
h1 { font-size: 24px; font-weight: 680; margin: 0; }
h2 { font-size: 18px; font-weight: 650; margin: 28px 0 12px; }
h3 { font-size:15px; font-weight:650; }
p { line-height:1.55; }
.sub { color: var(--faint); font-size: 13px; }
.tarjeta { background: var(--surface); border: 1px solid var(--border);
  border-radius: 12px; padding: 16px 18px; }

/* Project Overview exportado de Stitch */
.stitch-overview { display:grid; grid-template-columns:minmax(470px,1.65fr) minmax(270px,1fr); gap:24px; }.overview-main { display:grid; gap:24px; }.recommended { display:grid; grid-template-columns:52px 1fr; gap:16px; padding:20px; border:1px solid #5560e0; border-radius:8px; background:#1c1e2c; }.recommend-icon { width:52px; height:52px; display:grid; place-items:center; border:1px solid #4a52c4; background:#232842; color:#b9c2ff; }.recommended > div > span { color:#b9c2ff; font-size:11px; font-weight:700; }.recommended h1 { margin:5px 0 8px; font-size:20px; }.recommended p { max-width:520px; margin:0 0 16px; color:var(--muted); font-size:13px; }.recommended a { display:inline-block; padding:8px 16px; background:#b9c2ff; color:#1b1f52; font-size:11px; font-weight:700; }
.pipeline-panel { padding:16px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.pipeline-panel > b,.activity-log header,.active-tasks header { color:var(--muted); font-size:11px; }.pipeline-track { position:relative; display:grid; grid-template-columns:repeat(6,1fr); margin-top:24px; }.pipeline-track::before { content:""; position:absolute; top:13px; left:5%; right:5%; height:2px; background:var(--border); }.pipe-step { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:7px; }.pipe-step i { width:28px; height:28px; display:grid; place-items:center; border:2px solid var(--surface-3); border-radius:50%; background:var(--surface); color:var(--faint); font:normal 11px var(--font-mono); }.pipe-step.listo i { border-color:var(--ok); background:var(--ok); color:#083222; }.pipe-step.manual i { border-color:#7c86f6; }.pipe-step span { color:var(--muted); font:10px var(--font-mono); text-transform:capitalize; }
.overview-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.overview-metrics > div { min-height:112px; padding:16px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.overview-metrics span { display:block; color:var(--muted); font:10px var(--font-mono); }.overview-metrics b { display:block; margin-top:26px; font:500 34px var(--font-ui); }.overview-metrics b.blue { color:#aeb8ff; }
.activity-log { min-height:330px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.activity-log header,.active-tasks header { display:flex; justify-content:space-between; padding:12px 16px; border-bottom:1px solid var(--border); font-weight:700; }.activity-log header span { font-size:16px; }.activity-log > div { padding:14px 24px; }.activity-log p { display:grid; grid-template-columns:88px 20px 1fr; gap:10px; margin:0; padding:8px 0; font:11px var(--font-mono); }.activity-log time { color:#59606e; }.activity-log i { color:#7c86f6; font-style:normal; }.activity-log i.listo { color:var(--ok); }.activity-log i.error { color:var(--err); }
.active-tasks { min-height:100%; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.empty-task { height:calc(100% - 42px); display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--faint); }.empty-task .material-symbols-outlined { font-size:34px; }.empty-task b { margin-top:10px; font-size:13px; }.empty-task small { margin-top:4px; font:10px var(--font-mono); }

/* Gestión de fuentes exportada de Stitch */
.sources-head h1 { margin:8px 0 3px; font-size:32px; }.sources-head p { margin:0; color:var(--muted); }.source-tabs { display:flex; gap:18px; margin-top:28px; border-bottom:1px solid var(--border); }.source-tabs button { padding:10px 16px; border:0; border-radius:0; background:transparent; color:var(--muted); font:13px var(--font-mono); }.source-tabs button.active { color:#aeb8ff; border-bottom:2px solid #aeb8ff; }
.sources-workspace { display:grid; grid-template-columns:minmax(310px,.8fr) minmax(480px,1.55fr); gap:20px; margin-top:32px; }.sources-left { display:grid; grid-template-rows:auto minmax(320px,1fr); gap:16px; }.source-import,.extracted-list,.clean-preview { border:1px solid var(--border); border-radius:8px; background:var(--surface); }.source-import { padding:16px; }.source-pane { display:none; }.source-pane.active { display:grid; gap:10px; }.source-pane > b { color:var(--muted); font-size:11px; }.source-pane textarea { resize:vertical; border-radius:0; background:#131313; font-family:var(--font-mono); }.source-pane input { background:#131313; }.source-drop { display:flex; min-height:160px; flex-direction:column; align-items:center; justify-content:center; border:1px dashed var(--border); background:#131313; }.source-drop .material-symbols-outlined { color:#aeb8ff; font-size:32px; }.source-drop input { width:auto; max-width:100%; margin-top:12px; }.source-import-footer { display:flex; align-items:center; justify-content:space-between; margin-top:12px; }.source-import-footer button { display:flex; align-items:center; gap:5px; background:#aeb8ff; color:#002e6a; border-radius:0; font-family:var(--font-mono); }.source-import-footer button span { font-size:16px; }
.extracted-list { overflow:hidden; }.extracted-list > header,.clean-preview > header { height:42px; display:flex; align-items:center; justify-content:space-between; padding:0 12px; border-bottom:1px solid var(--border); color:var(--muted); font:11px var(--font-mono); }.extracted-list > div { display:grid; gap:6px; padding:8px; }.source-item { display:grid; grid-template-columns:1fr auto; gap:4px; padding:9px; border:0; border-left:2px solid transparent; border-radius:0; background:#131313; text-align:left; }.source-item.active { border-left-color:#aeb8ff; background:#17191d; }.source-item b { overflow:hidden; color:var(--text); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.source-item small { grid-column:1/-1; overflow:hidden; color:var(--muted); font:10px var(--font-mono); text-overflow:ellipsis; white-space:nowrap; }.source-item span { color:var(--muted); font:10px var(--font-mono); }.source-empty { padding:40px 10px; color:var(--faint); text-align:center; font:11px var(--font-mono); }
.clean-preview { min-height:680px; overflow:hidden; }.clean-preview > header { background:var(--surface-2); }.clean-preview > header b { color:var(--text); font-size:13px; }.clean-preview > header div { display:flex; gap:5px; }.clean-preview > header button { padding:5px 8px; border-radius:0; font:11px var(--font-mono); }.clean-preview article { max-width:760px; padding:36px 40px; }.clean-preview h2 { margin:0; font-size:32px; line-height:1.25; }.preview-meta { display:flex; gap:20px; margin:20px 0; padding-bottom:20px; border-bottom:1px solid #ffffff0d; color:var(--muted); font:11px var(--font-mono); }.preview-meta i { font-style:normal; }.clean-text { color:var(--text); font-size:16px; line-height:1.5; white-space:pre-wrap; }
@media(max-width:1000px) { .sources-workspace { grid-template-columns:1fr; }.clean-preview { min-height:500px; } }

/* Biblioteca de media exportada de Stitch */
.media-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }.media-head h1 { margin:8px 0 3px; font-size:28px; }.media-head > div:last-child { display:flex; gap:8px; }.media-head button { display:flex; align-items:center; gap:7px; padding:10px 16px; border-radius:0; font-size:14px; }.media-head button .material-symbols-outlined { font-size:17px; }.media-head button.upload,.media-import button.upload { background:#aeb8ff; color:#002e6a; }
.media-import { margin-top:18px; padding:16px; border:1px solid var(--border); background:var(--surface); }.media-import[hidden] { display:none; }.media-import-pane { display:none; }.media-import-pane.active { display:grid; gap:10px; }.media-import-pane textarea { margin-top:4px; background:#131313; }.trim-fields { display:grid; grid-template-columns:1fr 1fr; gap:8px; }.media-drop { min-height:150px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px dashed var(--border); background:#131313; }.media-drop .material-symbols-outlined { color:#aeb8ff; font-size:36px; }.media-drop small { margin:5px 0 12px; }.media-drop input { width:auto; }.media-import > footer { display:flex; justify-content:flex-end; gap:8px; margin-top:12px; }
.media-toolbar { display:flex; align-items:center; justify-content:space-between; margin-top:28px; padding:10px; border:1px solid #ffffff1a; border-radius:8px; background:#0e0e0e; }.media-toolbar > div { display:flex; align-items:center; gap:8px; }.media-toolbar button { border-radius:4px; }.media-toolbar button.active { background:var(--surface-3); }.media-toolbar i { width:1px; height:28px; margin:0 8px; background:#ffffff1a; }.media-toolbar .material-symbols-outlined { font-size:18px; }
.media-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:24px; }.media-card { overflow:hidden; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.media-preview { position:relative; height:164px; display:grid; place-items:center; overflow:hidden; background:#1e1e1e; }.media-preview video { width:100%; height:100%; object-fit:cover; }.quality,.media-duration { position:absolute; padding:3px 7px; border-radius:4px; background:#131313e8; color:var(--text); font:10px var(--font-mono); }.quality { top:8px; left:8px; }.media-duration { right:8px; bottom:8px; }.preview-play { position:absolute; width:40px; height:40px; display:grid; place-items:center; border-radius:50%; background:#131313cc; opacity:0; }.media-preview:hover .preview-play { opacity:1; }.media-card-body { padding:12px; }.media-card-body header { display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; }.media-card-body header b { overflow:hidden; font:500 11px var(--font-mono); text-overflow:ellipsis; white-space:nowrap; }.media-card-body header button { padding:0; border:0; }.media-card-body > div { display:flex; justify-content:space-between; margin-top:8px; color:var(--muted); font:10px var(--font-mono); }.media-card-body em { color:#aeb8ff; font-style:normal; }.media-card-body footer { margin-top:14px; padding-top:9px; border-top:1px solid #ffffff0d; text-align:right; }.media-card-body footer a { font:10px var(--font-mono); }.media-empty { min-height:280px; display:flex; flex-direction:column; align-items:center; justify-content:center; grid-column:1/-1; border:1px dashed var(--border); color:var(--faint); }.media-empty .material-symbols-outlined { font-size:38px; }.media-empty b { margin-top:10px; }.media-empty small { margin-top:5px; }
@media(max-width:1200px) { .media-grid { grid-template-columns:repeat(3,1fr); } } @media(max-width:900px) { .media-grid { grid-template-columns:repeat(2,1fr); } } @media(max-width:620px) { .media-head { align-items:flex-start; flex-direction:column; }.media-toolbar { align-items:flex-start; flex-direction:column; gap:8px; }.media-grid { grid-template-columns:1fr; } }

/* Transcripción exportada de Stitch */
.library-mode:has(.transcription-workspace) .envoltura { height:calc(100vh - 64px); padding:12px; overflow:hidden; }.transcription-workspace { height:100%; display:grid; grid-template-columns:320px minmax(0,1fr); gap:12px; }.transcription-queue,.transcription-main { overflow:hidden; border:1px solid var(--border); border-radius:8px; background:#131313; }.transcription-queue > header { height:62px; display:flex; align-items:center; justify-content:space-between; padding:0 10px; border-bottom:1px solid var(--border); }.transcription-queue h1 { font-size:20px; }.transcription-queue > div { display:grid; gap:6px; padding:8px; }.queue-item { position:relative; display:grid; grid-template-columns:auto 1fr; gap:4px 8px; padding:10px; border:1px solid #ffffff0d; border-radius:4px; background:#1b1b1b; text-align:left; }.queue-item.active { border-color:#aeb8ff; background:var(--surface-2); }.queue-item b { grid-column:1/-1; overflow:hidden; font:12px var(--font-mono); text-overflow:ellipsis; white-space:nowrap; }.queue-item span { width:max-content; padding:0 5px; border-radius:3px; background:var(--surface-3); font:10px var(--font-mono); }.queue-item small { color:var(--muted); font:10px var(--font-mono); }.queue-item i { position:absolute; right:10px; top:12px; color:var(--ok); font-style:normal; }
.transcription-main { display:grid; grid-template-rows:minmax(260px,52%) 48px minmax(0,1fr); }.transcription-video { overflow:hidden; background:#050505; }.transcription-video video { width:100%; height:100%; object-fit:contain; }.transcript-toolbar { display:flex; align-items:center; gap:10px; padding:7px 10px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--surface); font:11px var(--font-mono); }.transcript-toolbar label { position:relative; width:200px; margin:0; }.transcript-toolbar label span { position:absolute; left:7px; top:7px; font-size:16px; }.transcript-toolbar input { padding-left:28px; }.transcript-toolbar > button { margin-left:auto; border:0; background:transparent; color:#aeb8ff; font-family:var(--font-mono); }.transcript-toolbar #speaker-filters { display:flex; gap:5px; }.transcript-toolbar #speaker-filters button { padding:2px 8px; border-radius:4px; font:10px var(--font-mono); }
.transcript-panels { overflow-y:auto; }.transcript-panel { display:none; padding:16px; }.transcript-panel.active { display:grid; gap:10px; }.transcript-segment { display:grid; grid-template-columns:104px minmax(0,1fr); gap:14px; padding:12px; border:1px solid transparent; border-left:2px solid transparent; border-radius:4px; background:transparent; text-align:left; }.transcript-segment:hover,.transcript-segment.selected { border-color:var(--border); border-left-color:#aeb8ff; background:var(--surface-2); }.segment-time { display:flex; flex-direction:column; gap:5px; font:10px var(--font-mono); }.segment-time b { color:#aeb8ff; }.segment-time span { color:var(--muted); }.transcript-segment em { display:inline-block; padding:1px 6px; border-radius:4px; background:#23264d; color:#b9c2ff; font:normal 10px var(--font-mono); }.transcript-segment p { margin:7px 0 0; color:var(--text); font-size:15px; line-height:1.5; }.no-transcript { padding:60px; color:var(--faint); text-align:center; }
@media(max-width:900px) { .transcription-workspace { grid-template-columns:240px minmax(0,1fr); }.transcript-segment { grid-template-columns:80px minmax(0,1fr); } } @media(max-width:620px) { .library-mode:has(.transcription-workspace) .envoltura { height:auto; min-height:100vh; }.transcription-workspace { display:block; }.transcription-queue { margin-bottom:12px; }.transcription-main { height:800px; }.transcript-toolbar #speaker-filters { display:none; } }

/* espacio de trabajo del proyecto */
.project-hero { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:24px; }
.project-hero h1 { max-width:760px; margin:4px 0 6px; }
.project-hero-actions { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.status-badge { padding:5px 9px; border:1px solid #236148; border-radius:20px; background:var(--ok-bg); color:var(--ok); font-size:11px; font-weight:600; }
.overview-card { padding:18px; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:14px; }
.section-heading h2 { margin:3px 0 3px; }.section-heading p { margin:0; color:var(--muted); font-size:13px; }
.section-heading > strong { color:var(--accent); font-size:12px; }
.overview-card .pipeline { margin-bottom:14px; }.overview-card .barra { margin-top:12px; }
.workspace-section { scroll-margin-top:76px; margin-top:34px; }
.input-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.input-card { display:flex; flex-direction:column; justify-content:space-between; min-width:0; padding:18px; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.input-card h3 { margin:10px 0 5px; font-size:17px; }.input-card-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:8px; background:var(--accent-bg); color:var(--accent); }
.resource-count { margin-top:14px; color:var(--text); font-size:12px; font-weight:600; }
.resource-list { display:grid; gap:5px; margin:9px 0 14px; }
.resource-list > div { display:grid; grid-template-columns:18px minmax(0,1fr) auto; align-items:center; gap:6px; min-width:0; padding:6px 8px; background:var(--surface-2); border-radius:6px; font-size:11px; }
.resource-list span { color:var(--faint); }.resource-list b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:550; }.resource-list small { color:var(--faint); overflow:hidden; max-width:150px; text-overflow:ellipsis; white-space:nowrap; }
.input-card details { margin-top:14px; }.input-card summary { width:max-content; list-style:none; cursor:pointer; }.input-card summary::-webkit-details-marker { display:none; }
.input-form { display:grid; gap:8px; margin-top:12px; padding-top:12px; border-top:1px solid var(--border); }
.input-divider { display:flex; align-items:center; gap:8px; color:var(--faint); font-size:10px; text-transform:uppercase; }
.input-divider::before,.input-divider::after { content:""; height:1px; flex:1; background:var(--border); }
.file-drop { margin:0; padding:12px; border:1px dashed #394456; border-radius:8px; background:var(--bg); text-align:center; cursor:pointer; }
.file-drop input { display:block; max-width:100%; margin:7px auto 0; color:var(--faint); font-size:11px; }
.form-actions { display:flex; justify-content:flex-end; margin-top:3px; }
.stage-list { overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.stage-row { display:grid; grid-template-columns:28px minmax(0,1fr) auto; gap:12px; align-items:center; padding:13px 15px; border-bottom:1px solid var(--border); scroll-margin-top:76px; }
.stage-row:last-child { border-bottom:0; }.stage-copy h3 { margin:0 0 2px; }.stage-state { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; background:var(--surface-2); color:var(--faint); font-size:12px; font-weight:700; }
.stage-state.listo { color:var(--ok); background:var(--ok-bg); }.stage-state.error { color:var(--err); background:var(--err-bg); }

/* pipeline */
.pipeline { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 22px; }
.etapa { flex: 1; min-width: 92px; background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 10px 8px; text-align: center; }
.etapa .nom { font-size: 12px; margin-top: 4px; text-transform: capitalize; }
.etapa .punto { font-size: 11px; font-weight: 600; }
.etapa.listo .punto { color: var(--ok); }
.etapa.error .punto { color: var(--err); }
.etapa.pendiente { opacity: .6; }
.etapa.manual { background: var(--accent-bg); border-color: var(--accent); }
.etapa.manual .nom { color: var(--accent); font-weight: 600; }

/* metricas */
.metricas { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 12px; margin-bottom: 8px; }
.metrica { background: var(--surface-2); border-radius: var(--radius); padding: 14px 16px; }
.metrica .lbl { font-size: 12px; color: var(--faint); }
.metrica .val { font-family:var(--font-display); font-size: 22px; font-weight: 650; letter-spacing:-.025em; margin-top: 2px; }
.metrica .val small { font-size: 13px; color: var(--muted); font-weight: 400; }
.barra { height: 6px; background: var(--surface-2); border-radius: 6px; overflow: hidden; margin-top: 14px; }
.barra > span { display: block; height: 100%; background: var(--accent); }
.voz-config form { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 10px;
  align-items: center; margin-top: 12px; }
.voz-config audio { grid-column: 1 / -1; width: 100%; height: 38px; }
.previo-remoto { display:flex; gap:10px; align-items:center; margin-top:8px;
  padding:8px; background:var(--surface-2); border-radius:8px; }
.previo-remoto img { width:120px; height:68px; object-fit:cover; border-radius:6px; }
.speaker-panel { overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.speaker-card { display:grid; grid-template-columns:150px minmax(260px,1fr) minmax(240px,320px); gap:18px; align-items:center; padding:16px 18px; border-bottom:1px solid var(--border); }
.speaker-identity { display:flex; align-items:center; gap:10px; min-width:0; }
.speaker-avatar { width:36px; height:36px; flex:0 0 36px; display:grid; place-items:center; border-radius:50%; background:var(--accent-bg); color:var(--accent); font-family:var(--font-display); font-size:13px; font-weight:700; }
.speaker-source { display:block; max-width:92px; overflow:hidden; color:var(--text); font-size:12px; font-weight:650; text-overflow:ellipsis; white-space:nowrap; }
.speaker-sample { min-width:0; }
.speaker-quote { overflow:hidden; margin-bottom:7px; color:var(--muted); font-size:12px; line-height:1.45; text-overflow:ellipsis; white-space:nowrap; }
.muestra-orador { display:block; width:100%; height:34px; }
.speaker-fields { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(100px,.8fr); gap:8px; }
.speaker-fields label { margin:0; font-size:11px; }
.speaker-fields input,.speaker-fields select { margin-top:4px; }
.speaker-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 18px; background:var(--surface-2); }

/* guion y revisión */
.review-workspace { position:relative; }
.review-summary { position:sticky; top:70px; z-index:8; display:grid; grid-template-columns:repeat(5,1fr); gap:1px; overflow:hidden; margin-bottom:12px; background:var(--border); border:1px solid var(--border); border-radius:10px; box-shadow:0 8px 24px #0005; }
.review-summary > div { display:flex; flex-direction:column; padding:10px 12px; background:#11151cf2; backdrop-filter:blur(10px); }
.review-summary span { color:var(--faint); font-size:10px; }.review-summary b { margin-top:2px; color:var(--text); font-size:14px; }
.review-summary .summary-warning b { color:var(--warn); }.review-summary .summary-ok b { color:var(--ok); }
.revision-tools { justify-content:flex-end; }
.script-list { overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.bloque { position:relative; padding:18px; }.block-index { width:30px; flex:0 0 30px; padding-top:3px; color:var(--faint); font:11px var(--font-mono); }
.block-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:9px; }
.block-status { color:var(--faint); font-size:10px; font-weight:600; }.block-status.ok { color:var(--ok); }.block-status.warning { color:var(--warn); }.block-status.error { color:var(--err); }
.clip-metadata { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }.clip-metadata strong { font-size:12px; }
.bloque.retazo-b { box-shadow:inset 3px 0 var(--retazo); }.bloque:not(.retazo-b) { box-shadow:inset 3px 0 var(--accent); }
.revision-voz { margin-top:10px; padding:10px; border:1px solid var(--border); border-radius:8px; }
.revision-voz.voz-ok { border-color:var(--ok); }
.revision-voz audio { width:min(100%,520px); height:38px; }
.diferencia-voz { font-size:12px; margin-top:5px; color:var(--warn); }

/* botones / forms */
button, .btn { font-family:var(--font-ui); font-size: 13px; font-weight:550; line-height:1.35; padding: 7px 12px; border-radius: 8px;
  border: 1px solid var(--border); background: var(--surface); color: var(--text);
  cursor: pointer; }
button:hover { background: var(--surface-2); }
button:disabled { opacity: .45; cursor: not-allowed; }
.btn-ok { border-color: var(--ok); color: var(--ok); }
.btn-err { border-color: var(--err); color: var(--err); }
.btn-acc { border-color: var(--accent); color: var(--accent); }
input[type=text], input[type=search], input[type=url], input[type=number], textarea, input:not([type]), select { font-family:var(--font-ui); font-size:13px; line-height:1.45; width: 100%; padding: 8px 10px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text); }
input:focus, textarea:focus, select:focus { outline:2px solid #4b8cff55; border-color:var(--accent); }
label { font-size: 13px; color: var(--muted); display: block; margin: 10px 0 4px; }
form.inline { display: inline; }

/* biblioteca de proyectos */
.page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:22px; }
.page-heading h2,.nuevo-panel h2 { font-size:28px; font-weight:700; letter-spacing:-.035em; margin:3px 0 4px; }
.page-heading p,.nuevo-panel p { color:var(--muted); margin:0; font-size:14px; }
.eyebrow { color:var(--accent); font-size:10px; font-weight:750; letter-spacing:.14em; }
.btn-primario { display:inline-flex; align-items:center; justify-content:center; background:var(--accent); border-color:var(--accent); color:#fff; font-weight:650; padding:9px 15px; }
.btn-primario:hover { color:#fff; background:#397be7; }
.project-toolbar { display:grid; grid-template-columns:minmax(220px,1fr) auto auto auto; gap:8px; align-items:center; padding:10px; margin-bottom:18px; background:var(--surface); border:1px solid var(--border); border-radius:10px; }
.segmented { display:flex; padding:3px; background:var(--bg); border-radius:7px; }
.segmented button { border:0; padding:6px 10px; background:transparent; color:var(--muted); }
.segmented button.seleccionado { color:var(--text); background:var(--surface-3); }
.project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.project-card { overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:11px; transition:border-color .15s,transform .15s; }
.project-card:hover { border-color:#3b4658; transform:translateY(-1px); }
.project-cover { height:104px; position:relative; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#192231,#10151e); border-bottom:1px solid var(--border); }
.project-cover > span { color:#8292aa; font-size:26px; font-weight:750; letter-spacing:.05em; }
.estado-chip { position:absolute; left:10px; bottom:9px; max-width:calc(100% - 20px); padding:3px 8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; border-radius:12px; background:#0b0f16dd; color:var(--ok); font-size:10px; text-transform:capitalize; }
.project-card-body { padding:14px; }
.project-title { min-height:44px; display:flex; justify-content:space-between; gap:8px; }
.project-title > div { min-width:0; display:flex; flex-direction:column; }
.project-title a { overflow:hidden; color:var(--text); font-weight:650; text-overflow:ellipsis; white-space:nowrap; }
.project-title small { color:var(--faint); font:11px var(--font-mono); letter-spacing:-.01em; }
.project-title button { padding:2px 6px; height:28px; color:var(--muted); }
.progress-label { display:flex; justify-content:space-between; margin-top:12px; color:var(--muted); font-size:11px; }
.progress-label b { color:var(--text); }
.project-card .barra { margin-top:6px; }
.project-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:4px; margin-top:14px; color:var(--faint); font-size:10px; }
.project-stats span { display:flex; flex-direction:column; }
.project-stats b { color:var(--text); font-size:14px; }
.project-alert { margin-top:12px; padding:7px 9px; color:var(--warn); background:var(--warn-bg); border-radius:6px; font-size:11px; }
.btn-continuar { display:flex; justify-content:center; margin-top:12px; background:var(--surface-2); color:var(--text); }
.nuevo-panel { display:grid; grid-template-columns:minmax(220px,.8fr) minmax(320px,1.2fr); gap:48px; margin-top:34px; padding:24px; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.nuevo-panel h2 { font-size:22px; }
.nuevo-panel .btn { margin-top:15px; }
.empty-state { padding:70px 20px; text-align:center; color:var(--muted); border:1px dashed var(--border); border-radius:12px; }
.empty-icon { width:48px; height:48px; display:grid; place-items:center; margin:auto; border-radius:50%; background:var(--accent-bg); color:var(--accent); font-size:24px; }
.empty-state h2 { color:var(--text); }

/* Biblioteca fiel al proyecto Stitch */
.stitch-page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; }
.stitch-page-head h1 { font-size:32px; font-weight:600; letter-spacing:-.02em; }.stitch-page-head p { margin:4px 0 0; color:var(--muted); }
.head-actions { display:flex; gap:8px; }.head-actions button,.primary-action { display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:7px 14px; border-radius:8px; font:13px var(--font-mono); }
.primary-action { background:var(--accent); border:1px solid var(--accent); color:#00285d; }.primary-action .material-symbols-outlined,.head-actions .material-symbols-outlined { font-size:16px; }
.dashboard-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(280px,1fr); gap:24px; margin-top:32px; }
.continue-section > h2,.processing-section > h2,.all-projects h2 { display:flex; align-items:center; gap:4px; margin:0 0 8px; font-size:18px; font-weight:500; }.continue-section > h2 span { color:var(--accent); }.processing-section > h2 span { color:#7c86f6; }
.continue-card { min-height:330px; display:grid; grid-template-columns:40% 1fr; overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:12px; }
.continue-visual { position:relative; display:grid; place-items:center; min-height:330px; background:#1e1e1e; border-right:1px solid #ffffff0d; color:var(--border); }.continue-visual > .material-symbols-outlined { font-size:56px; }
.ai-badge,.time-badge { position:absolute; padding:2px 7px; border:1px solid #ffffff1a; border-radius:4px; font:11px var(--font-mono); }.ai-badge { top:8px; left:8px; background:#4b57d8cc; color:#d6a9ff; }.time-badge { right:8px; bottom:8px; background:#131313dd; color:var(--text); }
.continue-body { display:flex; flex-direction:column; padding:16px; }.continue-title { display:flex; justify-content:space-between; }.continue-title h3 { margin:4px 0 0; font-size:24px; font-weight:600; }.continue-title button { border:0; font-size:24px; padding:0; }.continue-body > p { margin:10px 0 16px; color:var(--muted); font-size:13px; }
.tech { color:var(--muted); font:11px var(--font-mono); }.stitch-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:4px; margin-top:auto; }.stitch-stats > div { padding:8px; background:#0e0e0e; border:1px solid #ffffff0d; border-radius:4px; }.stitch-stats small,.stitch-stats b { display:block; font-family:var(--font-mono); }.stitch-stats small { color:var(--muted); font-size:11px; }.stitch-stats b { margin-top:4px; font-size:12px; font-weight:500; }.stitch-stats b.blue { color:#aeb8ff; text-transform:capitalize; }
.continue-footer { display:flex; align-items:center; gap:8px; margin-top:16px; padding-top:16px; border-top:1px solid #ffffff1a; }.next-step { margin-left:auto; padding:5px 8px; background:var(--surface-3); border:1px solid var(--border); border-radius:4px; font-size:12px; text-transform:capitalize; }
.processing-panel { min-height:330px; display:flex; flex-direction:column; padding:8px; background:var(--surface); border:1px solid var(--border); border-radius:12px; }.processing-panel > a { margin-top:auto; padding:8px; color:var(--muted); text-align:center; font:11px var(--font-mono); }.task-row { display:grid; grid-template-columns:1fr auto; gap:4px; padding:10px; background:#0e0e0e; border:1px solid #ffffff0d; border-radius:8px; }.task-row b { font:13px var(--font-mono); }.task-row small { grid-column:1/-1; color:var(--muted); font:11px var(--font-mono); }.task-row .ok { color:var(--ok); font-size:16px; }
.all-projects { margin-top:40px; padding-top:32px; border-top:1px solid #ffffff0d; }.all-projects-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }.view-control { display:flex; align-items:center; gap:8px; padding:4px; background:var(--surface); border:1px solid var(--border); border-radius:4px; }.view-control span { padding:5px; font-size:15px; }.view-control span.active { background:var(--surface-2); }.view-control i { width:1px; height:20px; background:var(--border); }
.stitch-project-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }.stitch-project-card { overflow:hidden; background:var(--surface); border:1px solid var(--border); border-radius:8px; }.project-thumb { position:relative; height:128px; display:grid; place-items:center; background:#1e1e1e; border-bottom:1px solid #ffffff0d; color:var(--border); }.project-thumb > .material-symbols-outlined { font-size:38px; }.project-thumb em { position:absolute; top:8px; right:8px; padding:2px 6px; background:#131313e6; border:1px solid #ffffff1a; border-radius:4px; color:#b9c2ff; font:normal 10px var(--font-mono); text-transform:capitalize; }.project-info { padding:8px; }.project-info h3 { overflow:hidden; margin:2px 0 10px; font-size:14px; font-weight:500; text-overflow:ellipsis; white-space:nowrap; }.project-meta { display:grid; grid-template-columns:1fr 1fr; gap:5px; margin-bottom:14px; color:var(--muted); font:10px var(--font-mono); }.project-meta .voice { grid-column:1/-1; color:#aeb8ff; }.project-progress { position:relative; padding-top:8px; border-top:1px solid #ffffff0d; }.project-progress > div { width:calc(100% - 34px); height:4px; overflow:hidden; margin-bottom:4px; border-radius:4px; background:var(--surface-3); }.project-progress i { display:block; height:100%; background:var(--accent); }.project-progress a { position:absolute; right:0; top:7px; width:26px; height:26px; display:grid; place-items:center; border-radius:4px; background:var(--surface-2); color:var(--text); }
.blank-project { min-height:246px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px dashed var(--border); border-radius:8px; background:#1c1b1b; color:var(--muted); }.blank-project .material-symbols-outlined { font-size:32px; }.blank-project b { margin-top:8px; font-size:14px; }.blank-project small { margin-top:4px; font:11px var(--font-mono); }
.stitch-create { display:grid; grid-template-columns:1fr 2fr; gap:32px; margin-top:40px; padding:24px; background:var(--surface); border:1px solid var(--border); border-radius:8px; }.stitch-create h2 { margin:5px 0; }.stitch-create p { color:var(--muted); }.stitch-create form { display:grid; grid-template-columns:1fr 1fr; gap:8px; }.stitch-create form button { grid-column:1/-1; justify-self:end; }

@media (max-width:1200px) { .stitch-project-grid { grid-template-columns:repeat(3,1fr); }.continue-card { grid-template-columns:34% 1fr; } }
@media (max-width:900px) { .dashboard-grid { grid-template-columns:1fr; }.stitch-project-grid { grid-template-columns:repeat(2,1fr); }.top-tabs { display:none; }.top-search { display:none; } }
@media (max-width:620px) { .stitch-page-head { align-items:flex-start; flex-direction:column; }.continue-card { grid-template-columns:1fr; }.continue-visual { min-height:180px; border-right:0; }.stitch-stats { grid-template-columns:repeat(2,1fr); }.continue-footer { align-items:flex-start; flex-wrap:wrap; }.next-step { margin-left:0; }.stitch-project-grid { grid-template-columns:1fr; }.stitch-create,.stitch-create form { grid-template-columns:1fr; } }

@media (max-width: 1050px) { .project-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:1200px) { .app-shell:has(.project-sidebar) { grid-template-columns:74px 230px minmax(0,1fr); }.stitch-overview { grid-template-columns:1fr; }.active-tasks { min-height:220px; } }
@media (max-width: 820px) {
  :root { --sidebar:74px; }
  .brand > span:last-child,.nav-item:not(.activo),.nav-seccion,.proyecto-mini,.estado-local div { font-size:0; }
  .brand { justify-content:center; }.nav-item { justify-content:center; font-size:0; }.nav-item span { font-size:18px; }
  .nav-item.activo { font-size:0; min-height:38px; }.estado-local { justify-content:center; }
  .envoltura { padding-inline:20px; }.nuevo-panel { grid-template-columns:1fr; gap:14px; }.input-grid { grid-template-columns:1fr; }
  .speaker-card { grid-template-columns:120px minmax(0,1fr); }.speaker-fields { grid-column:1/-1; }
  .review-summary { grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 620px) {
  .app-shell { display:block; }.sidebar { position:static; width:100%; height:auto; flex-direction:row; align-items:center; padding:9px 12px; }
  .brand { padding:0; margin-right:auto; }.nav-global { display:flex; }.sidebar-spacer,.estado-local,.sidebar > nav:last-of-type { display:none; }
  .topbar { padding-inline:14px; }.guardado { display:none; }.envoltura { padding:20px 14px 60px; }
  .page-heading { align-items:flex-start; flex-direction:column; }.page-heading .btn { width:100%; }
  .project-toolbar { grid-template-columns:1fr auto auto; }.project-toolbar .segmented { grid-column:1/-1; grid-row:2; }
  .project-grid { grid-template-columns:1fr; }.nuevo-panel { padding:18px; }
  .project-hero { align-items:flex-start; flex-direction:column; }.project-hero-actions { width:100%; justify-content:space-between; }
  .metricas { grid-template-columns:repeat(2,1fr); }.pipeline { display:grid; grid-template-columns:repeat(2,1fr); }
  .stage-row { grid-template-columns:28px minmax(0,1fr); }.stage-row form { grid-column:2; }.resource-list small { display:none; }
  .speaker-card { grid-template-columns:1fr; gap:12px; }.speaker-fields { grid-column:auto; }.speaker-actions { align-items:stretch; flex-direction:column; }.speaker-actions .btn { width:100%; }
  .review-summary { position:static; grid-template-columns:repeat(2,1fr); }.block-index { display:none; }
}

/* proyectos lista */
.proj { display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0; border-bottom: 1px solid var(--border); }
.proj:last-child { border-bottom: none; }
.prog { font-family:var(--font-mono); font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }

/* bloques revisión */
.bloque { display: flex; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.bloque:last-child { border-bottom: none; }
.bloque.aprobado { background: var(--ok-bg); }
.bloque.descartado { opacity: .5; }
.bloque.retazo-b { background: var(--retazo-bg); }
.bloque.retazo-b.aprobado { background: var(--ok-bg); }
.pill { font-size: 11px; padding: 2px 9px; border-radius: 20px; display: inline-block; }
.pill.narr { background: var(--accent-bg); color: var(--accent); }
.pill.ret { background: var(--retazo-bg); color: var(--retazo); }
.tc { font-family:var(--font-mono); font-size: 12px; color: var(--faint); font-variant-numeric:tabular-nums; }
.orador { font-size: 12px; color: var(--muted); }
.texto-narr { font-family:var(--font-ui); font-size:14px; line-height:1.65; }
.acciones { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.revision-tools { display: flex; gap: 8px; margin-bottom: 10px; }
.editor-narr { margin: 8px 0; min-height: 118px; resize: vertical; font-family:var(--font-ui); font-size:14px; line-height:1.6; }
.abrir-editor { margin-top: 10px; }
.editor-dialog { width: min(980px, 96vw); max-height: 94vh; padding: 0; border: 1px solid #4b4b4b;
  border-radius: 14px; background: #222; color: #f5f5f5; box-shadow: 0 24px 80px #000b; }
.editor-dialog::backdrop { background: #000b; backdrop-filter: blur(3px); }
.editor-cabecera { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; }
.editor-cabecera button { background: #333; color: #fff; border-color: #555; }
.reloj { color: #aaa; font: 16px var(--font-mono); font-variant-numeric:tabular-nums; margin-top: 3px; }
#video-editor { display: block; width: 100%; height: min(48vh, 460px); object-fit: contain; background: #000; }
.timeline-editor { position: relative; height: 92px; margin: 18px 20px 12px; border-radius: 10px;
  overflow: visible; background: #111; touch-action: none; cursor: crosshair; }
.timeline-editor > img { width: 100%; height: 100%; display: block; object-fit: fill; border-radius: 8px; user-select: none; }
.zona-fuera { position: absolute; top: 0; bottom: 0; background: #0009; pointer-events: none; }
.zona-fuera.izquierda { left: 0; border-radius: 8px 0 0 8px; }
.zona-fuera.derecha { border-radius: 0 8px 8px 0; }
.seleccion-editor { position: absolute; top: -4px; bottom: -4px; border: 3px solid #ff4d55;
  border-radius: 8px; pointer-events: none; }
.tirador { position: absolute; top: -3px; bottom: -3px; width: 24px; padding: 0; border: 0;
  border-radius: 9px; background: #ff4d55; pointer-events: auto; cursor: ew-resize; }
.tirador::after { content: ''; position: absolute; width: 3px; height: 28px; border-radius: 2px;
  background: #fff; left: 10px; top: calc(50% - 14px); }
.tirador.inicio { left: -14px; }
.tirador.fin { right: -14px; }
.cabezal-editor { position: absolute; top: -12px; bottom: -8px; width: 18px; background: transparent;
  cursor: ew-resize; touch-action: none; transform: translateX(-9px); z-index: 4; }
.cabezal-editor::after { content: ''; position: absolute; top: 0; bottom: 0; left: 8px;
  width: 2px; background: #fff; }
.cabezal-editor::before { content: ''; position: absolute; top: -1px; left: 3px; border: 6px solid transparent;
  border-top-color: #fff; }
.valores-recorte { display: flex; align-items: end; gap: 12px; padding: 0 20px; flex-wrap: wrap; }
.valores-recorte label { color: #bbb; margin: 0; }
.valores-recorte > button { align-self: end; margin-bottom: 1px; background: #333; color: #fff; border-color: #555; }
.valores-recorte input { display: block; width: 120px; padding: 7px 8px; margin-top: 3px; border: 1px solid #555;
  border-radius: 7px; background: #181818; color: #fff; font: 14px var(--font-technical); }
#duracion-seleccion { color: #aaa; font-size: 13px; padding-bottom: 8px; }
.texto-recorte-editor { padding: 14px 20px 0; }
.texto-recorte-editor label { color: #bbb; margin-top: 0; }
.texto-recorte-editor textarea { background: #181818; border-color: #555; color: #fff; resize: vertical; }
.controles-editor { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 18px 20px 22px; }
.controles-editor button { background: #444; border-color: #555; color: #fff; }
.controles-editor .play-editor { min-width: 156px; height: 58px; border-radius: 30px; font-size: 16px;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 2px solid #7db7ff;
  background: #315f91; font-weight: 600; }
.play-editor .icono-play { font-size: 22px; min-width: 24px; line-height: 1; }
.play-editor .texto-play { min-width: 76px; text-align: left; }
.controles-editor #form-recorte { margin-left: auto; }
.controles-editor .guardar-editor { background: #1976f3; border-color: #1976f3; padding: 10px 24px; font-size: 15px; }
@media (max-width: 640px) {
  #video-editor { height: 34vh; }
  .timeline-editor { height: 70px; margin-inline: 14px; }
  .controles-editor { flex-wrap: wrap; padding-inline: 12px; }
  .controles-editor #form-recorte { margin-left: 0; }
}

/* continuidad del flujo */
.export-screen { padding-bottom:60px; }.export-head { padding-bottom:15px; border-bottom:1px solid #ffffff1a; }.export-head h1 { margin:0; font-size:32px; }.export-head p { margin:5px 0 0; color:var(--muted); font:10px var(--font-mono); }.export-head p span { padding:3px 7px; border-radius:3px; background:var(--surface); }.export-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(300px,1fr); gap:12px; margin-top:22px; align-items:start; }.export-main,.export-side { display:flex; flex-direction:column; gap:12px; }.export-card,.integrity-card,.export-actions { border:1px solid #ffffff1a; border-radius:8px; background:var(--surface); }.export-card > header { display:flex; align-items:center; gap:8px; padding:16px; border-bottom:1px solid #ffffff12; }.export-card > header h2 { margin:0; font-size:18px; }.export-card > header .material-symbols-outlined { color:var(--accent); }.xml-settings { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:#ffffff0d; }.xml-settings > div { padding:16px; background:var(--surface); }.xml-settings small,.xml-settings b { display:block; }.xml-settings small { color:var(--muted); font:9px var(--font-mono); }.xml-settings b { margin-top:6px; font:12px var(--font-mono); }.xml-settings p { margin:5px 0 0; color:var(--muted); font-size:11px; line-height:1.45; }.package-files > header { justify-content:space-between; }.package-files > header div { display:flex; align-items:center; gap:8px; }.package-files > header em { color:var(--muted); font:normal 9px var(--font-mono); }.package-row { display:grid; grid-template-columns:24px 1fr auto auto; gap:10px; align-items:center; padding:11px 16px; border-bottom:1px solid #ffffff0d; }.package-row:last-child { border-bottom:0; }.package-row > .material-symbols-outlined { color:#929090; font-size:20px; }.package-row b,.package-row small { display:block; }.package-row b { font:11px var(--font-mono); }.package-row small,.package-row > em { margin-top:3px; color:var(--muted); font:normal 9px var(--font-mono); }.package-row a { display:flex; align-items:center; gap:4px; padding:5px 7px; border:1px solid var(--border); border-radius:4px; color:var(--accent); font:9px var(--font-mono); }.package-row a span { font-size:14px; }.import-help { display:flex; gap:10px; padding:14px; border:1px solid #aeb8ff33; border-radius:8px; background:#aeb8ff08; }.import-help > span { color:var(--accent); }.import-help b { font-size:13px; }.import-help p { margin:4px 0 0; color:var(--muted); font-size:11px; line-height:1.55; }.import-help code { color:var(--accent); }
.integrity-card { padding:16px; }.integrity-card h2 { margin:0 0 12px; color:var(--muted); font:10px var(--font-mono); }.integrity-row { display:flex; gap:9px; margin-top:6px; padding:10px; border:1px solid #ffffff0d; border-radius:4px; background:#131313; }.integrity-row > span { color:#4ade80; font-size:17px; }.integrity-row.problem > span { color:#fbbf24; }.integrity-row b,.integrity-row small { display:block; }.integrity-row b { font:11px var(--font-mono); }.integrity-row small { margin-top:3px; color:var(--muted); font:9px var(--font-mono); }.export-actions { display:grid; gap:12px; padding:14px; }.export-actions form { margin:0; }.export-actions button,.export-actions a { width:100%; display:flex; align-items:center; justify-content:center; gap:7px; padding:10px; border-radius:6px; }.export-actions .generate-package { padding:13px; border-color:var(--accent); background:var(--accent); color:#00285d; font-size:15px; font-weight:600; }.export-actions a { border:1px solid var(--border); color:var(--text); font-size:12px; }.export-actions .material-symbols-outlined { font-size:18px; }
@media(max-width:950px){.export-grid{grid-template-columns:1fr}}@media(max-width:600px){.xml-settings{grid-template-columns:1fr}.package-row{grid-template-columns:24px 1fr}.package-row>em,.package-row>a{grid-column:2}}

.voice-actions-top > div { display:flex; align-items:center; gap:12px; }.voice-actions-top a.next-audio { padding:7px 10px; border:1px solid var(--accent); border-radius:4px; color:var(--accent); }

/* flashes */
.audio-screen { padding-bottom:60px; }.audio-breadcrumb { display:flex; align-items:center; gap:6px; margin-bottom:10px; color:var(--muted); font:10px var(--font-mono); }.audio-breadcrumb .material-symbols-outlined { font-size:14px; }.audio-breadcrumb b { color:var(--text); }.audio-screen .stitch-page-head form { display:flex; align-items:center; gap:10px; }.denoise-toggle { display:flex; align-items:center; gap:6px; margin:0; color:var(--muted); font:10px var(--font-mono); text-transform:none; letter-spacing:0; }.denoise-toggle input { accent-color:var(--accent); }
.audio-pipelines { display:grid; grid-template-columns:.8fr 1.2fr; gap:12px; margin-top:28px; }.audio-pipelines article { padding:20px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.audio-pipelines header,.audio-pipelines header div { display:flex; align-items:center; justify-content:space-between; gap:8px; }.audio-pipelines header { padding-bottom:14px; border-bottom:1px solid #ffffff1a; }.audio-pipelines h2 { margin:0; font-size:18px; }.audio-pipelines header em { padding:3px 7px; border:1px solid var(--border); border-radius:4px; color:var(--muted); font:normal 9px var(--font-mono); }.audio-pipelines header .material-symbols-outlined { color:var(--accent); font-size:20px; }.audio-pipelines header .purple { color:#b9c2ff; }.dsp-chain { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:20px; }.dsp-chain > div { text-align:center; }.dsp-chain b { display:block; padding:8px 12px; border:1px solid var(--border); border-radius:20px; background:var(--surface-3); font:11px var(--font-mono); white-space:nowrap; }.dsp-chain small { display:block; margin-top:5px; color:var(--muted); font:9px var(--font-mono); }.dsp-chain i { color:var(--border); font-style:normal; }.dsp-chain .unavailable { opacity:.45; }
.audio-tasks { margin-top:28px; }.audio-tasks > header { display:flex; align-items:end; justify-content:space-between; margin-bottom:10px; }.audio-tasks h2 { margin:0; font-size:18px; }.audio-tasks header p { margin:3px 0 0; color:var(--muted); font-size:11px; }.audio-summary { display:flex; gap:6px; }.audio-summary span { padding:4px 7px; border:1px solid var(--border); border-radius:4px; color:var(--muted); font:9px var(--font-mono); }.audio-table { overflow:hidden; border:1px solid #ffffff1a; border-radius:8px; background:var(--surface); }.audio-table-head,.audio-row { display:grid; grid-template-columns:110px 180px 150px minmax(300px,1fr) 110px; gap:12px; align-items:center; }.audio-table-head { padding:10px 14px; border-bottom:1px solid #ffffff1a; background:#1c1b1b; color:var(--muted); font:9px var(--font-mono); }.audio-row { min-height:92px; padding:10px 14px; border-bottom:1px solid #ffffff0d; }.audio-row:last-child { border-bottom:0; }.audio-row > div:first-child b,.audio-row > div:nth-child(2) b { display:block; font:11px var(--font-mono); }.audio-row small { display:block; margin-top:4px; color:var(--muted); font:9px var(--font-mono); }.chain-status { display:flex; flex-wrap:wrap; gap:4px; }.chain-status span { padding:4px 5px; border:1px solid var(--border); border-radius:3px; color:var(--muted); font:9px var(--font-mono); }.chain-status span.done { border-color:#4ade8055; color:#4ade80; background:#1a382244; }.chain-status span.protected { border-color:#fbbf2455; color:#fbbf24; background:#3a2b1244; }.chain-status > small { flex-basis:100%; margin:0; color:#fbbf24; }.ab-audio { display:grid; grid-template-columns:1fr 1fr; gap:6px; }.ab-audio label { margin:0; color:var(--muted); font:8px var(--font-mono); }.ab-audio audio { display:block; width:100%; height:30px; margin-top:3px; }.audio-state { color:#fbbf24; }.audio-state.ready { color:#4ade80; }.audio-state .material-symbols-outlined { float:left; margin-right:5px; font-size:16px; }.audio-state b { display:block; font:10px var(--font-mono); }.audio-state small { margin-left:21px; }
@media(max-width:1150px){.audio-pipelines{grid-template-columns:1fr}.audio-table-head{display:none}.audio-row{grid-template-columns:100px 160px 130px 1fr}.audio-row .audio-state{grid-column:1/-1}.dsp-chain.clips{flex-wrap:wrap}}@media(max-width:700px){.audio-screen .stitch-page-head form{align-items:flex-start;flex-direction:column}.audio-row{grid-template-columns:1fr}.ab-audio{grid-template-columns:1fr}.dsp-chain{flex-wrap:wrap}}

.voices-screen { padding-bottom:60px; }.voices-layout { display:grid; grid-template-columns:350px minmax(0,1fr); gap:12px; align-items:start; }.voice-column { display:flex; flex-direction:column; gap:12px; }.voice-panel,.pronunciation-panel { padding:14px; border:1px solid #ffffff1a; border-radius:8px; background:#1e1e1e; }.voice-panel > header,.pronunciation-panel > header { display:flex; justify-content:space-between; align-items:center; padding-bottom:12px; border-bottom:1px solid #ffffff1a; }.voice-panel h2,.pronunciation-panel h1 { margin:0; }.voice-panel h2 { font-size:18px; }.voice-panel form { display:flex; flex-direction:column; gap:9px; margin-top:14px; }.voice-panel label { margin:0; color:var(--muted); font:11px var(--font-mono); }.voice-panel select,.dictionary input { width:100%; margin-top:5px; background:#131313; color:var(--text); border-color:var(--border); }.voice-panel audio { width:100%; height:36px; }.voice-panel form small { color:var(--muted); font:10px var(--font-mono); }.active-voice { display:flex; gap:10px; align-items:center; margin-top:15px; padding:11px; border:1px solid #4ade8044; border-radius:5px; background:#1a382255; color:#4ade80; }.active-voice small,.active-voice b { display:block; }.active-voice small { font:9px var(--font-mono); }.active-voice b { margin-top:2px; color:var(--text); font-size:13px; }.dictionary-list { margin-top:12px; overflow:hidden; border:1px solid #ffffff0d; border-radius:4px; background:#252525; }.dictionary-head,.dictionary-list > div { display:grid; grid-template-columns:1fr 1fr; gap:7px; padding:7px 8px; border-bottom:1px solid #ffffff0d; font-size:12px; }.dictionary-head { color:var(--muted); background:#353534; font:9px var(--font-mono)!important; text-transform:uppercase; }.dictionary-list p { padding:12px; color:var(--muted); font-size:11px; }.dictionary form { display:grid; grid-template-columns:1fr 1fr; gap:6px; }.dictionary form button { grid-column:1/-1; }
.pronunciation-panel { min-width:0; }.pronunciation-panel > header h1 { font-size:24px; }.pronunciation-panel > header p { margin:3px 0 0; color:var(--muted); font-size:12px; }.pronunciation-panel > header > div:last-child { display:flex; gap:6px; }.voice-count { padding:4px 7px; border:1px solid; border-radius:4px; font:10px var(--font-mono); }.voice-count.ok { color:#4ade80; border-color:#4ade8044; background:#1a3822; }.voice-count.pending { color:#fbbf24; border-color:#fbbf2444; background:#3b2a12; }.voice-actions-top { display:flex; justify-content:space-between; align-items:center; padding:12px 0; }.voice-actions-top form { margin:0; }.voice-actions-top a { color:var(--muted); font:11px var(--font-mono); }.pronunciation-list { display:flex; flex-direction:column; gap:12px; }.pronunciation-card { padding:16px; border:1px solid #ffffff1a; border-radius:8px; background:#252525; }.pronunciation-card.warning { border-color:#fbbf2455; }.pronunciation-card.approved { border-color:#4ade8044; }.pronunciation-card > header { display:flex; justify-content:space-between; align-items:center; }.pronunciation-card > header div { display:flex; gap:8px; align-items:center; }.pronunciation-card > header b { font:12px var(--font-mono); }.pronunciation-card > header span,.pronunciation-card > header em { padding:3px 6px; border-radius:3px; background:#353534; color:var(--muted); font:normal 9px var(--font-mono); }.warning > header span,.warning > header em { color:#fbbf24; background:#3b2a12; }.approved > header em { color:#4ade80; background:#1a3822; }.comparison { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }.comparison small { color:var(--muted); font:9px var(--font-mono); }.comparison > div:last-child small { color:#b9c2ff; }.comparison p { min-height:80px; margin:5px 0 0; padding:10px; border:1px solid #ffffff0d; border-radius:4px; background:#131313; font-size:13px; line-height:1.55; }.pronunciation-card > audio { width:100%; height:36px; margin-top:10px; }.word-differences { display:flex; flex-wrap:wrap; gap:5px; margin-top:9px; }.word-differences span { padding:3px 6px; border-radius:3px; background:#3b2a12; color:#fbbf24; font:10px var(--font-mono); }.pronunciation-actions { display:flex; gap:6px; margin-top:10px; }.pronunciation-actions form { margin:0; }
@media(max-width:1000px){.voices-layout{grid-template-columns:1fr}.voice-column{display:grid;grid-template-columns:1fr 1fr}.comparison{grid-template-columns:1fr}}@media(max-width:650px){.voice-column{grid-template-columns:1fr}.pronunciation-panel>header{align-items:flex-start;flex-direction:column;gap:10px}.pronunciation-actions{flex-wrap:wrap}}

.script-generator { padding-bottom:60px; }.script-generator .head-actions a { padding:8px 13px; border:1px solid var(--border); border-radius:4px; color:var(--text); font:12px var(--font-mono); }
.generator-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:24px; margin-top:28px; align-items:start; }.generator-main { display:flex; flex-direction:column; gap:12px; }.generator-card,.generator-side { border:1px solid var(--border); border-radius:8px; background:var(--surface); }.generator-card { padding:18px; }.generator-card > header { display:flex; gap:12px; align-items:flex-start; margin-bottom:18px; }.generator-card > header > span { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:#aeb8ff18; color:var(--accent); font:11px var(--font-mono); }.generator-card h2,.generator-side h2 { margin:0; font-size:16px; }.generator-card header p { margin:3px 0 0; color:var(--muted); font-size:12px; }.source-counts { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }.source-counts div { padding:12px; border:1px solid #ffffff0d; border-radius:4px; background:#131313; }.source-counts b,.source-counts small { display:block; font-family:var(--font-mono); }.source-counts b { color:var(--accent); font-size:20px; }.source-counts small { margin-top:3px; color:var(--muted); font-size:9px; }
.tone-options { display:flex; flex-wrap:wrap; gap:8px; }.tone-options input { position:absolute; opacity:0; }.tone-options span { display:block; padding:7px 12px; border:1px solid var(--border); border-radius:20px; color:var(--muted); font:11px var(--font-mono); cursor:pointer; }.tone-options input:checked + span { border-color:#b9c2ff; background:#b9c2ff12; color:#b9c2ff; }.balance-control { display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center; color:var(--muted); font:11px var(--font-mono); }.balance-control input { accent-color:#aeb8ff; }.generator-card textarea { width:100%; resize:vertical; min-height:96px; background:#131313; border-color:var(--border); }
.generator-side { position:sticky; top:80px; padding:18px; }.generator-side > label { display:block; margin-top:20px; color:var(--muted); font:11px var(--font-mono); }.generator-side select,.generator-side input { width:100%; margin-top:6px; background:#131313; color:var(--text); border:1px solid var(--border); }.duration-field { position:relative; }.duration-field span { position:absolute; right:10px; top:15px; color:var(--muted); font-size:11px; }.duration-field input { padding-right:65px; }.generation-note { display:flex; gap:9px; margin-top:22px; padding:12px; border:1px solid #7c86f644; border-radius:6px; background:#7c86f60c; color:#b9c2ff; }.generation-note span { font-size:18px; }.generation-note p { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }.generate-button { width:100%; display:flex; align-items:center; justify-content:center; gap:7px; margin-top:22px; padding:11px; border-color:#7c86f6; background:#4b57d8; color:#dfe4ff; font-weight:600; }.generator-side > small { display:block; margin-top:8px; color:var(--muted); text-align:center; font-size:10px; }
.standalone-review > *:not(.review-workspace):not(dialog):not(script) { display:none !important; }.standalone-review .review-workspace { margin:0; padding-bottom:70px; border:0; background:transparent; }.standalone-review .section-heading { align-items:center; margin-bottom:22px; }.standalone-review .section-heading .eyebrow { display:none; }.standalone-review .section-heading h2 { font-size:32px; font-weight:600; letter-spacing:-.02em; }.standalone-review .section-heading p { font-size:14px; }.standalone-review .review-summary { top:64px; border-radius:6px; box-shadow:none; }.standalone-review .script-list { border-radius:8px; background:transparent; }.standalone-review .bloque { margin-bottom:8px; padding:16px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }.standalone-review .bloque.retazo-b { background:#ffb4ab08; }.standalone-review .bloque.aprobado { border-color:#7bdba055; }.standalone-review .editor-narr { background:#131313; border-color:#ffffff12; }.standalone-review .block-index { color:var(--muted); font:12px var(--font-mono); }
@media(max-width:1000px){.generator-layout{grid-template-columns:1fr}.generator-side{position:static}.source-counts{grid-template-columns:repeat(2,1fr)}}

.speakers-screen { padding-bottom:70px; }
.speakers-head { align-items:center; }
.speakers-head button:disabled { cursor:not-allowed; opacity:.45; }
.speaker-group { margin-top:30px; }
.speaker-group > header { display:flex; align-items:center; gap:10px; padding-bottom:9px; border-bottom:1px solid #ffffff1a; }
.speaker-group > header .material-symbols-outlined { color:var(--muted); }
.speaker-group > header h2 { margin:0; font:500 13px var(--font-mono); }
.speaker-group > header em { padding:3px 8px; border-radius:4px; background:var(--surface); color:var(--muted); font:normal 11px var(--font-mono); }
.speaker-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:16px; }
.speaker-stitch-card { display:flex; flex-direction:column; gap:14px; padding:16px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }
.speaker-stitch-card.identified { border-color:#8c909f; }
.speaker-card-head,.speaker-card-head > div { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.speaker-card-head b { font:500 13px var(--font-mono); }.speaker-color { width:12px; height:12px; border-radius:50%; background:#aeb8ff; box-shadow:0 0 8px #aeb8ff88; }.speaker-color.c1 { background:#b9c2ff; }.speaker-color.c2 { background:#92d5b0; }.speaker-color.c3 { background:#ffb4ab; }.speaker-color.c4 { background:#e6c75f; }
.speaker-status { display:flex; align-items:center; gap:4px; padding:4px 7px; border:1px solid var(--border); border-radius:4px; color:var(--muted); background:var(--surface-2); font:11px var(--font-mono); }.speaker-status .material-symbols-outlined { font-size:14px; }.identified .speaker-status { border-color:#aeb8ff55; background:#aeb8ff10; color:#aeb8ff; }
.speaker-audio { padding:9px 10px; border:1px solid #ffffff0d; border-radius:4px; background:#131313; }.speaker-audio audio { display:block; width:100%; height:34px; color-scheme:dark; }
.speaker-stitch-card blockquote { min-height:42px; margin:0; padding-left:10px; border-left:2px solid #ffffff1a; color:#e5e2e1cc; font-size:13px; font-style:italic; line-height:1.5; }
.speaker-inputs { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:auto; padding-top:12px; border-top:1px solid #ffffff0d; }.speaker-inputs label { margin:0; color:var(--muted); font:11px var(--font-mono); text-transform:none; letter-spacing:0; }.speaker-inputs input,.speaker-inputs select { width:100%; margin-top:5px; padding:7px 9px; border:1px solid var(--border); border-radius:4px; background:#131313; color:var(--text); font:13px var(--font-ui); }
@media(max-width:1100px){.speakers-head{align-items:flex-start;flex-direction:column}.speaker-grid{grid-template-columns:1fr}}
@media(max-width:620px){.speaker-inputs{grid-template-columns:1fr}.speakers-head .head-actions{flex-wrap:wrap}}

.flash { padding: 10px 14px; border-radius: 8px; margin-bottom: 12px; font-size: 14px; white-space: pre-line; }
.flash.ok { background: var(--ok-bg); color: var(--ok); }
.flash.error { background: var(--err-bg); color: var(--err); }
.flash.aviso { background: var(--warn-bg); color: var(--warn); }

/* Shell unificado — Chimi Professional */
.unified-shell { min-height:100vh; display:grid !important; grid-template-columns:256px minmax(0,1fr) !important; }
.unified-shell .sidebar { position:sticky; top:0; width:auto; height:100vh; padding:12px 0; background:#1c1b1b; border-right:1px solid #333; }
.unified-shell .brand { gap:8px; min-height:64px; margin:0 12px 12px; padding:0; letter-spacing:0; }
.unified-shell .brand .logo { flex:0 0 32px; border-radius:4px; background:#4d8eff; color:#00285d; font-size:18px; }
.unified-shell .brand > span:last-child { min-width:0; }
.unified-shell .brand b { color:#aeb8ff; font-size:24px; line-height:28px; letter-spacing:-.02em; }
.unified-shell .brand small { max-width:180px; overflow:hidden; color:#c2c6d6; font:13px/18px var(--font-ui); text-overflow:ellipsis; white-space:nowrap; }
.unified-shell .nav-global { display:flex; flex-direction:column; gap:4px; overflow-y:auto; }
.unified-shell .nav-new { margin:0 12px 12px; padding:8px 12px; border-radius:4px; background:#4d8eff; color:#fff; font:500 13px/18px var(--font-ui); }
.unified-shell .nav-item { min-height:34px; padding:7px 12px; border:0; border-right:2px solid transparent; border-radius:0; color:#c2c6d6; font:400 13px/20px var(--font-ui); }
.unified-shell .nav-item:hover { background:#252525; color:#e5e2e1; }
.unified-shell .nav-item.activo { border-right-color:#aeb8ff; background:#2a2a2a; color:#aeb8ff; font-weight:700; }
.unified-shell .nav-item .material-symbols-outlined { width:20px; font-size:18px; }
.system-status { display:flex; flex-direction:column; gap:5px; margin:12px 12px 0; padding:12px 0 0; border-top:1px solid #333; color:#c2c6d6; font:500 11px/14px var(--font-mono); }
.system-status span { display:flex; align-items:center; gap:7px; }.system-status i { width:7px; height:7px; border-radius:50%; background:#4edea3; box-shadow:0 0 8px #4edea366; }.system-status small { color:#8c909f; font:500 11px/14px var(--font-mono); }
.unified-shell .workspace { min-width:0; background:#131313; }
.compact-topbar { height:56px; padding:0 16px; background:#131313; border-bottom:1px solid #333; }
.top-context { min-width:0; display:flex; align-items:center; gap:10px; }.top-context > div { min-width:0; display:flex; align-items:baseline; gap:10px; }.top-context b { font-size:18px; line-height:24px; }.top-context small { overflow:hidden; max-width:420px; color:#8c909f; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.mobile-menu { display:none; width:32px; height:32px; padding:0; place-items:center; border-radius:4px; }.mobile-menu .material-symbols-outlined { font-size:19px; }
.save-state { display:flex; align-items:center; gap:5px; color:#c2c6d6; font:500 11px/16px var(--font-mono); }.save-state .material-symbols-outlined { color:#4edea3; font-size:17px; }
.continue-action { padding:7px 14px; border-radius:4px; background:#aeb8ff; color:#002e6a; font:500 13px/18px var(--font-mono); }.continue-action:hover { background:#d8e2ff; }
.icon-link { width:30px; height:30px; display:grid; place-items:center; color:#c2c6d6; }.icon-link .material-symbols-outlined { font-size:19px; }
.unified-shell .envoltura { padding:24px 32px 80px; }

@media(max-width:820px) {
  .unified-shell { display:block !important; }
  .unified-shell .sidebar { position:fixed; left:0; top:0; z-index:100; width:256px; height:100vh; display:flex; flex-direction:column; align-items:stretch; padding:12px 0; transform:translateX(-100%); transition:transform .18s ease; box-shadow:12px 0 30px #0008; }
  .unified-shell .sidebar.open { transform:translateX(0); }
  .unified-shell .brand { justify-content:flex-start; margin-right:12px; }.unified-shell .brand > span:last-child { display:flex; }
  .unified-shell .nav-global { display:flex; }.unified-shell .nav-item,.unified-shell .nav-item.activo { justify-content:flex-start; min-height:34px; font-size:13px; }
  .unified-shell .sidebar-spacer { display:block; }.unified-shell .system-status { display:flex; }
  .mobile-menu { display:grid; }
  .top-context small,.save-state { display:none; }
  .unified-shell .envoltura { padding:20px 14px 60px; }
}

/* Tipografía consistente: DM Sans para UI; mono solo para datos temporales/técnicos. */
html, body, button, input, textarea, select, option { font-family:var(--font-ui); }
.tc, .reloj, .prog, .segment-time, .time-badge, .media-duration,
.quality, .tech, time, code, pre, samp, kbd,
.valores-recorte input, .export-head p, .system-status small {
  font-family:var(--font-technical);
  font-variant-numeric:tabular-nums;
}