/* [TAREAS AUTOMÁTICAS · v150] «Mis agentes IA» (antes «Mis asistentes») y «Enséñame una tarea».
   Premium y sobrio: luz, un check elegante, transiciones suaves, sin confeti. El núcleo es el de
   Brainmore (brainmore-experto.js); aquí sólo su escenario. 390 px sin desborde horizontal. */
:root {
  --primary: #7A2C36; --primary-dark: #5C1F26; --primary-soft: #F5E8EA; --on-primary: #FFFFFF;
  --text: #16161A; --text-mute: #5F6672; --border: #E6E3E3; --bg: #F6F5F4; --card: #FFFFFF; --card-alt: #FBFAF9;
  --ok: #15803D; --ok-soft: #DCFCE7; --warn: #B45309; --warn-soft: #FEF3C7; --bad: #B91C1C; --bad-soft: #FEE2E2;
  --info: #1D4ED8; --info-soft: #DBEAFE;
  --glow: 0 0 0 1px rgba(79,70,229,.10), 0 10px 40px rgba(79,70,229,.10);
  --shadow: 0 1px 2px rgba(20,20,20,.04), 0 10px 30px rgba(20,20,20,.07);
  --radio: 18px; --radio-sm: 12px;
  --ease: cubic-bezier(.2,.8,.2,1);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --primary: #D98A95; --primary-dark: #E9A9B2; --primary-soft: #3A2226; --on-primary: #1B1012;
    --text: #EDEBEA; --text-mute: #A7A2A0; --border: #33302F; --bg: #121111; --card: #1B1919; --card-alt: #221F1F;
    --ok: #4ADE80; --ok-soft: #14301E; --warn: #FBBF24; --warn-soft: #3A2E12; --bad: #F87171; --bad-soft: #3B1818;
    --info: #93C5FD; --info-soft: #172554;
    --glow: 0 0 0 1px rgba(129,140,248,.18), 0 10px 40px rgba(129,140,248,.14);
    --shadow: 0 1px 2px rgba(0,0,0,.4), 0 10px 30px rgba(0,0,0,.35);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --primary: #D98A95; --primary-dark: #E9A9B2; --primary-soft: #3A2226; --on-primary: #1B1012;
  --text: #EDEBEA; --text-mute: #A7A2A0; --border: #33302F; --bg: #121111; --card: #1B1919; --card-alt: #221F1F;
  --ok: #4ADE80; --ok-soft: #14301E; --warn: #FBBF24; --warn-soft: #3A2E12; --bad: #F87171; --bad-soft: #3B1818;
  --info: #93C5FD; --info-soft: #172554;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { overflow-x: hidden; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: 'Inter', -apple-system, BlinkMacSystemFont,
  'Segoe UI', sans-serif; font-size: 15px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
button { font: inherit; }
[hidden] { display: none !important; }
a { color: var(--primary); }

.as-cabecera { background: var(--card); border-bottom: 1px solid var(--border); }
.as-cabecera-in { max-width: 1080px; margin: 0 auto; padding: 14px 16px 16px; display: flex; gap: 12px;
  align-items: flex-end; justify-content: space-between; flex-wrap: wrap; }
.as-volver { font-size: 13px; text-decoration: none; color: var(--text-mute); }
.as-volver:hover { color: var(--primary); }
h1 { font-size: 26px; letter-spacing: -.02em; margin: 4px 0 0; font-weight: 700; }
h2 { font-size: 20px; letter-spacing: -.01em; margin: 0 0 6px; }
h3 { font-size: 16px; margin: 0 0 6px; }
.as-bajada { color: var(--text-mute); margin: 2px 0 0; }
.as-main { max-width: 1080px; margin: 0 auto; padding: 20px 16px 72px; }

.as-btn { text-decoration: none; display: inline-block; border: 1px solid var(--border); background: var(--card); color: var(--text); border-radius: 999px;
  padding: 10px 18px; cursor: pointer; font-weight: 600; transition: transform .15s var(--ease), background .2s, box-shadow .2s; }
.as-btn:hover { transform: translateY(-1px); box-shadow: var(--shadow); }
.as-btn:focus-visible { outline: 2px solid var(--info); outline-offset: 2px; }
.as-btn.primario { background: var(--primary); border-color: var(--primary); color: var(--on-primary); }
.as-btn.grande { padding: 14px 28px; font-size: 17px; }
.as-btn.suave { background: transparent; }
.as-btn[disabled] { opacity: .55; cursor: default; transform: none; box-shadow: none; }
.as-acciones { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }

.as-tarjeta { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); padding: 20px;
  box-shadow: var(--shadow); margin-bottom: 16px; }
.as-escena { background: radial-gradient(120% 100% at 50% 0%, rgba(99,102,241,.08) 0%, transparent 60%), var(--card);
  border: 1px solid var(--border); border-radius: 22px; padding: 22px; box-shadow: var(--glow); margin-bottom: 16px;
  position: relative; overflow: hidden; }
.as-escena-fila { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 22px; align-items: center; }
@media (max-width: 720px) { .as-escena-fila { grid-template-columns: minmax(0, 1fr); } }

/* el núcleo: su escenario; en el nacimiento se compacta hacia la tarjeta */
.as-nucleo { width: 170px; height: 170px; margin: 0 auto; transition: transform .9s var(--ease), opacity .9s var(--ease); }
.as-nucleo.chico { width: 64px; height: 64px; }
.as-nucleo.compacto { transform: scale(.36) translateY(-40px); opacity: .9; }
.as-nucleo canvas { width: 100%; height: 100%; display: block; }

/* Entendí: la línea de pasos humanos */
.as-linea { list-style: none; padding: 0; margin: 14px 0 6px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.as-linea li { display: inline-flex; gap: 8px; align-items: center; background: var(--card-alt); border: 1px solid var(--border);
  border-radius: 999px; padding: 8px 14px; font-weight: 600; font-size: 14px; opacity: 0; transform: translateY(6px);
  transition: opacity .45s var(--ease), transform .45s var(--ease), border-color .3s, box-shadow .3s; max-width: 100%; }
.as-linea li.visible { opacity: 1; transform: none; }
.as-linea li.hecho { border-color: color-mix(in srgb, var(--ok) 55%, var(--border)); }
.as-linea li.hecho::after { content: "✓"; color: var(--ok); font-weight: 700; }
.as-linea li.actual { border-color: #6366F1; box-shadow: 0 0 0 3px rgba(99,102,241,.15); }
.as-linea .flecha { background: none; border: 0; padding: 0; color: var(--text-mute); font-weight: 400; }
.as-cuando { display: inline-flex; gap: 8px; align-items: center; color: var(--text-mute); font-weight: 600; }
.as-frase { font-size: 17px; margin: 4px 0 0; }
.as-nota { color: var(--text-mute); font-size: 14px; margin: 6px 0 0; }
.as-honesto { background: var(--warn-soft); border-radius: var(--radio-sm); padding: 10px 14px; margin-top: 12px; font-size: 14px; }

/* Muéstrame */
.as-texto { width: 100%; min-height: 130px; border: 1px solid var(--border); border-radius: var(--radio-sm); padding: 14px;
  background: var(--card-alt); color: var(--text); font: inherit; resize: vertical; }
.as-texto:focus { outline: 2px solid color-mix(in srgb, var(--info) 45%, transparent); }
.as-adjuntos { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.as-chip { border: 1px dashed var(--border); background: transparent; border-radius: 999px; padding: 7px 12px; cursor: pointer;
  color: var(--text-mute); font-size: 14px; }
.as-chip.lleno { border-style: solid; color: var(--text); background: var(--card-alt); }
.as-ejemplos { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }

/* Una pregunta a la vez */
.as-pregunta { font-size: 19px; font-weight: 600; margin: 4px 0 12px; }
.as-opciones { display: flex; gap: 10px; flex-wrap: wrap; }
.as-libre { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.as-libre input { flex: 1 1 220px; min-width: 0; border: 1px solid var(--border); border-radius: 999px; padding: 10px 14px;
  background: var(--card-alt); color: var(--text); font: inherit; }

/* Construyendo y «Así piensa» */
.as-hechos { list-style: none; padding: 0; margin: 10px 0 0; display: grid; gap: 8px; }
.as-hechos li { display: flex; gap: 10px; align-items: center; opacity: .35; transition: opacity .5s var(--ease); }
.as-hechos li.encendido { opacity: 1; }
.as-hechos li .ic { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--card-alt);
  border: 1px solid var(--border); flex: none; }
.as-hechos li.encendido .ic { background: var(--ok-soft); border-color: transparent; color: var(--ok); }
.as-piensa { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; align-items: center; }
.as-piensa span.v { background: var(--card-alt); border: 1px solid var(--border); border-radius: 10px; padding: 6px 10px;
  font-size: 13px; font-weight: 600; }
.as-piensa span.f { color: var(--text-mute); }

/* Comprobé: la escena principal */
.as-comp-cabeza { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.as-marcador { font-size: 30px; font-weight: 700; letter-spacing: -.02em; display: inline-flex; gap: 10px; align-items: center; }
.as-marcador .de { font-weight: 500; color: var(--text-mute); font-size: 20px; }
.as-tabla { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 14px; table-layout: fixed; }
.as-tabla thead th { position: sticky; top: 0; background: var(--card); z-index: 1; }
.as-tabla th { text-align: left; color: var(--text-mute); font-weight: 600; font-size: 12px; text-transform: uppercase;
  letter-spacing: .04em; padding: 6px 8px; }
.as-tabla th.num, .as-tabla td.num { text-align: right; width: 22%; }
.as-tabla th.res, .as-tabla td.res { width: 38px; text-align: center; }
.as-tabla td { padding: 8px; border-top: 1px solid var(--border); overflow-wrap: anywhere; }
.as-tabla tr { opacity: 0; transform: translateX(-6px); transition: opacity .35s var(--ease), transform .35s var(--ease), background .4s; }
.as-tabla tr.visible { opacity: 1; transform: none; }
.as-tabla tr.distinto { background: color-mix(in srgb, var(--warn-soft) 80%, transparent); }
.as-tabla tr.distinto td { font-weight: 600; }
.as-tabla tr.resuelto { background: transparent; }
.as-tabla-envase { max-height: 440px; overflow: auto; border-radius: var(--radio-sm); }
.as-dif { border: 1px solid color-mix(in srgb, var(--warn) 40%, var(--border)); background: var(--warn-soft);
  border-radius: var(--radio-sm); padding: 14px; margin-top: 14px; }
.as-dif h3 { margin: 0 0 4px; }
.as-aprendio { border: 1px solid color-mix(in srgb, var(--ok) 35%, var(--border)); background: var(--ok-soft);
  border-radius: var(--radio-sm); padding: 12px 14px; margin-top: 12px; }
.as-aprendio .antes { text-decoration: line-through; color: var(--text-mute); }
.as-comprobado { display: flex; gap: 14px; align-items: center; margin-top: 16px; padding: 14px; border-radius: var(--radio-sm);
  background: linear-gradient(90deg, color-mix(in srgb, var(--ok-soft) 90%, transparent), transparent); }
.as-check { width: 40px; height: 40px; flex: none; }
.as-check circle { fill: none; stroke: var(--ok); stroke-width: 2; opacity: .3; }
.as-check path { fill: none; stroke: var(--ok); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 30; stroke-dashoffset: 30; animation: as-trazo .8s .15s var(--ease) forwards; }
@keyframes as-trazo { to { stroke-dashoffset: 0; } }
.as-vivo { color: var(--text-mute); font-size: 14px; min-height: 22px; }

/* Nace tu asistente / Mis asistentes: la tarjeta viva */
.as-grilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.as-agente { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio); padding: 18px;
  box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 10px; position: relative; min-width: 0;
  border-top: 4px solid var(--acento, #4F46E5); transition: transform .2s var(--ease), box-shadow .2s; }
.as-agente:hover { transform: translateY(-2px); }
.as-agente.nuevo { animation: as-nace .9s var(--ease); }
@keyframes as-nace { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
.as-agente-cab { display: flex; gap: 10px; align-items: center; min-width: 0; }
.as-avatar { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 22px; flex: none;
  background: color-mix(in srgb, var(--acento, #4F46E5) 14%, var(--card)); }
.as-agente-nombre { font-weight: 700; font-size: 17px; overflow-wrap: anywhere; }
.as-estado { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; font-weight: 600; border-radius: 999px;
  padding: 3px 10px; background: var(--card-alt); border: 1px solid var(--border); }
.as-estado::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--text-mute); }
.as-estado.ok::before { background: var(--ok); }
.as-estado.trabajando::before { background: #6366F1; animation: as-latido 1.1s infinite; }
.as-estado.esperando::before { background: var(--info); }
.as-estado.ayuda::before { background: #F59E0B; }
.as-estado.listo::before { background: var(--ok); }
@keyframes as-latido { 50% { transform: scale(1.6); opacity: .5; } }
.as-cuentas { display: flex; gap: 12px; flex-wrap: wrap; font-size: 14px; color: var(--text-mute); }
.as-cuentas b { color: var(--text); }
.as-mapa { display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.as-mapa span { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--card-alt);
  border: 1px solid var(--border); font-size: 14px; position: relative; }
.as-mapa span.hecho { border-color: color-mix(in srgb, var(--ok) 60%, var(--border)); }
.as-mapa span.actual { border-color: #6366F1; animation: as-pulso 1.4s infinite; }
.as-mapa span.ayuda { border-color: #F59E0B; background: var(--warn-soft); }
.as-mapa i { width: 10px; height: 1px; background: var(--border); display: inline-block; }
@keyframes as-pulso { 0% { box-shadow: 0 0 0 0 rgba(99,102,241,.45); } 100% { box-shadow: 0 0 0 10px rgba(99,102,241,0); } }
.as-pie { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--text-mute); }
.as-modo { font-size: 13px; font-weight: 600; }
.as-equipo { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.as-equipo div { background: var(--card); border: 1px solid var(--border); border-radius: var(--radio-sm); padding: 10px 16px; }
.as-equipo b { font-size: 22px; display: block; }
.as-vacio { text-align: center; padding: 40px 16px; }

/* identidad */
.as-ident { display: grid; gap: 10px; margin-top: 12px; }
.as-ident input { border: 1px solid var(--border); border-radius: 999px; padding: 10px 14px; background: var(--card-alt);
  color: var(--text); font: inherit; width: 100%; max-width: 360px; }
.as-colores, .as-iconos { display: flex; gap: 8px; flex-wrap: wrap; }
.as-colores button { width: 30px; height: 30px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; }
.as-colores button[aria-pressed="true"], .as-iconos button[aria-pressed="true"] { border-color: var(--text); }
.as-iconos button { width: 38px; height: 38px; border-radius: 10px; border: 2px solid var(--border); background: var(--card-alt);
  cursor: pointer; font-size: 18px; }

/* ficha */
.as-ficha { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; }
@media (max-width: 860px) { .as-ficha { grid-template-columns: minmax(0, 1fr); } }
.as-dato { color: var(--text-mute); font-size: 13px; margin: 0; }
.as-lista { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 8px; }
.as-lista li { border: 1px solid var(--border); border-radius: var(--radio-sm); padding: 10px 12px; background: var(--card-alt); }
.as-porque { color: var(--text-mute); font-size: 13px; margin-top: 4px; }
.as-link { background: none; border: 0; padding: 0; color: var(--primary); cursor: pointer; font-size: 13px; }
.as-correo { white-space: pre-wrap; background: var(--card-alt); border: 1px solid var(--border); border-radius: var(--radio-sm);
  padding: 12px; font-size: 14px; max-height: 280px; overflow: auto; }
.as-ayuda { border: 1px solid color-mix(in srgb, #F59E0B 50%, var(--border)); background: var(--warn-soft); }
.as-error { background: var(--bad-soft); color: var(--bad); border-radius: var(--radio-sm); padding: 10px 14px; margin-bottom: 12px; }
.as-cargando { color: var(--text-mute); }
pre.as-tecnico { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; background: var(--card-alt); padding: 12px;
  border-radius: var(--radio-sm); max-height: 420px; overflow: auto; }

/* ✨ Mejorar este asistente (v151) */
.as-mejorar { border-color: color-mix(in srgb, #6366F1 30%, var(--border)); box-shadow: var(--glow); }
.as-zona { border: 1.5px dashed var(--border); border-radius: var(--radio); padding: 10px; background: var(--card-alt);
  transition: border-color .2s, background .2s; }
.as-zona:focus-within, .as-zona.arrastrando { border-color: #6366F1; background: color-mix(in srgb, #6366F1 5%, var(--card-alt)); }
.as-zona .as-texto { min-height: 88px; border: 0; background: transparent; padding: 6px; }
.as-cambio { margin-top: 16px; border-top: 1px solid var(--border); padding-top: 14px; }
.as-cadena { list-style: none; padding: 0; margin: 10px 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.as-cadena li { display: inline-flex; gap: 6px; align-items: center; border: 1px solid var(--border); background: var(--card-alt);
  border-radius: 999px; padding: 6px 12px; font-size: 13px; font-weight: 600; max-width: 100%; overflow-wrap: anywhere;
  transition: border-color .3s, box-shadow .3s, background .3s; }
.as-cadena li.f { border: 0; background: none; padding: 0; color: var(--text-mute); font-weight: 400; }
.as-cadena li .marca { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #4F46E5; }
.as-cadena li.nuevo { border-color: #6366F1; background: color-mix(in srgb, #6366F1 10%, var(--card));
  animation: as-aparece .8s var(--ease), as-pulso 1.6s 2; }
.as-cadena li.cambiado { border-color: color-mix(in srgb, #F59E0B 60%, var(--border)); }
.as-cadena li.actual { border-color: #6366F1; box-shadow: 0 0 0 3px rgba(99,102,241,.18); }
.as-cadena li.hecho { border-color: color-mix(in srgb, var(--ok) 60%, var(--border)); }
.as-cadena li.hecho::after { content: "✓"; color: var(--ok); }
@keyframes as-aparece { from { opacity: 0; transform: scale(.8); } to { opacity: 1; transform: none; } }
.as-antes-ahora { display: grid; gap: 0; margin-top: 10px; border: 1px solid var(--border); border-radius: var(--radio-sm); overflow: hidden; }
.as-antes-ahora .cab, .as-antes-ahora .fila { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: 10px;
  padding: 8px 12px; }
.as-antes-ahora .cab { color: var(--text-mute); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; background: var(--card-alt); }
.as-antes-ahora .fila { border-top: 1px solid var(--border); font-size: 14px; overflow-wrap: anywhere; }
.as-antes-ahora .antes { color: var(--text-mute); }
.as-antes-ahora .ahora { font-weight: 600; }
.as-alcance { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; margin-top: 12px; }
.as-alcance ul { list-style: none; padding: 0; margin: 4px 0 0; display: grid; gap: 4px; font-size: 14px; }
.as-alcance ul.si li::before { content: "● "; color: #6366F1; }
.as-alcance ul.no li::before { content: "✓ "; color: var(--ok); }
.as-chequeos { list-style: none; padding: 0; margin: 6px 0 0; display: grid; gap: 2px; font-size: 14px; }
.as-chequeos li.mal { color: var(--warn); font-weight: 600; }
.as-resumen { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.as-resumen span { border: 1px solid var(--border); border-radius: 999px; padding: 4px 10px; font-size: 13px; font-weight: 600; background: var(--card-alt); }
.as-resumen span.mas { border-color: color-mix(in srgb, var(--ok) 50%, var(--border)); background: var(--ok-soft); }
.as-resumen span.menos { border-color: color-mix(in srgb, var(--bad) 40%, var(--border)); background: var(--bad-soft); }
.as-duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; margin-top: 10px; }
.as-lado { border: 1px solid var(--border); border-radius: var(--radio-sm); padding: 10px; min-width: 0; background: var(--card-alt); }
.as-hojas { display: flex; gap: 4px; flex-wrap: wrap; margin: 4px 0 8px; }
.as-hojas button { border: 1px solid var(--border); background: var(--card); border-radius: 8px; padding: 3px 8px; font-size: 12px; cursor: pointer;
  max-width: 100%; overflow-wrap: anywhere; }
.as-hojas button.nueva { border-color: var(--ok); background: var(--ok-soft); font-weight: 700; }
.as-hojas button[aria-pressed="true"] { outline: 2px solid color-mix(in srgb, var(--info) 60%, transparent); }
.as-mini-envase { overflow: auto; max-height: 260px; }
.as-mini { border-collapse: collapse; font-size: 11px; width: max-content; min-width: 100%; }
.as-mini th, .as-mini td { border: 1px solid var(--border); padding: 2px 6px; white-space: nowrap; }
.as-mini th { background: var(--card); }
.as-valor { background: none; border: 0; border-bottom: 1px dashed var(--primary); color: inherit; cursor: pointer; padding: 0; font: inherit; }
.as-tabla tr.corregido td { background: color-mix(in srgb, var(--info-soft) 70%, transparent); }
.as-tabla th.por, .as-tabla td.res .as-link { white-space: nowrap; }
.as-valores th.res, .as-valores td.res { width: 86px; }
.as-porque-caja { background: var(--card-alt); border-radius: var(--radio-sm); padding: 8px 10px; font-size: 13px; display: grid; gap: 2px; }
.as-salud.confiable { border-left: 4px solid var(--ok); }
.as-salud.atencion { border-left: 4px solid #F59E0B; }
.as-salud.por_validar { border-left: 4px solid #2563EB; }
@media (max-width: 720px) {
  .as-duo, .as-alcance { grid-template-columns: minmax(0, 1fr); }
  .as-antes-ahora .cab { display: none; }
  .as-antes-ahora .fila { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .as-linea li, .as-tabla tr { opacity: 1; transform: none; }
  .as-check path { stroke-dashoffset: 0; }
}
@media (max-width: 480px) {
  .as-tabla th { letter-spacing: 0; font-size: 11px; overflow-wrap: anywhere; }
  .as-tabla th.num, .as-tabla td.num { width: 25%; }
  .as-escena { padding: 16px; }
}

/* [AGENTES IA 29-09] Dueño y alcance, «a quién y por dónde envía», compartir y secciones. */
.as-seccion-titulo { font-size: 15px; font-weight: 700; color: var(--text-mute); text-transform: none; margin: 22px 0 10px;
  display: flex; align-items: baseline; gap: 8px; }
.as-seccion-titulo .n { font-weight: 600; font-size: 13px; }
.as-seccion-vacia { color: var(--text-mute); font-size: 14px; margin: 0 0 6px; }
.as-dueno { font-size: 12.5px; color: var(--text-mute); margin-top: 2px; overflow-wrap: anywhere; }
.as-envio-linea { font-size: 13px; color: var(--text); background: var(--card-alt); border: 1px solid var(--border);
  border-radius: var(--radio-sm); padding: 8px 10px; margin: 10px 0 0; overflow-wrap: anywhere; }
.as-envio { border-left: 3px solid var(--primary); }
.as-entrega { padding: 10px 0; border-top: 1px solid var(--border); }
.as-entrega:first-of-type { border-top: 0; }
.as-entrega-cab { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; font-weight: 600; }
.as-entrega-cab .modo { font-weight: 500; color: var(--text-mute); font-size: 13px; }
.as-entrega dl { display: grid; grid-template-columns: max-content 1fr; gap: 2px 10px; margin: 6px 0 0; font-size: 14px; }
.as-entrega dt { color: var(--text-mute); }
.as-entrega dd { margin: 0; overflow-wrap: anywhere; min-width: 0; }
.as-entrega .estado { font-size: 13px; margin-top: 6px; padding: 6px 10px; border-radius: 10px; background: var(--info-soft); }
.as-entrega .estado.pausado, .as-entrega .estado.tope, .as-entrega .estado.fuera_de_lista,
.as-entrega .estado.sin_numero, .as-entrega .estado.apagado { background: var(--warn-soft); }
.as-candado { background: var(--warn-soft); border-radius: var(--radio-sm); padding: 10px 12px; font-size: 14px; }
.as-compartir .fila { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 8px 0;
  border-top: 1px solid var(--border); }
.as-compartir .fila .quien { flex: 1 1 180px; min-width: 0; overflow-wrap: anywhere; }
.as-compartir select { font: inherit; border: 1px solid var(--border); border-radius: 10px; padding: 7px 10px;
  background: var(--card); color: var(--text); max-width: 100%; }
.as-alcances { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.as-alcances button[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); border-color: var(--primary); }
.as-por-aprobar { border-left: 3px solid var(--warn); }
/* [WP4] la zona «Muéstrame» también al enseñar: miniatura de la captura y «×» para quitar */
.as-adjunto { display: inline-flex; align-items: center; gap: 6px; }
.as-miniatura { width: 28px; height: 28px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border); }
.as-quitar { border: 0; background: transparent; cursor: pointer; font-size: 16px; line-height: 1; padding: 0 2px; color: inherit; }

/* [4.16.1] «Retirar agente»: confirmación en la página, aviso y «Retirados». */
.as-btn.peligro { background: var(--bad); border-color: var(--bad); color: #FFFFFF; }
.as-confirma { margin-top: 12px; border: 1px solid color-mix(in srgb, var(--bad) 40%, var(--border)); background: var(--bad-soft);
  border-radius: var(--radio-sm); padding: 14px; }
.as-confirma .as-lista { margin: 6px 0 10px; }
.as-aviso { background: var(--ok-soft); border: 1px solid color-mix(in srgb, var(--ok) 35%, var(--border)); color: var(--text);
  border-radius: var(--radio-sm); padding: 10px 14px; margin-bottom: 12px; }
.as-retirado-banda { background: var(--card-alt); border: 1px dashed var(--border); border-radius: var(--radio-sm); padding: 12px 14px;
  margin-bottom: 12px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.as-retirados li { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between;
  background: var(--card); border: 1px solid var(--border); border-radius: var(--radio-sm); padding: 10px 14px; margin-bottom: 8px; }
.as-retirados { list-style: none; padding: 0; margin: 0 0 16px; }

/* [V1] marca BETA del creador: discreta, siempre visible */
.as-beta { font-size: 13px; color: var(--text-mute); margin: 0 0 10px; }
.as-beta b { font-size: 11px; letter-spacing: .06em; border: 1px solid var(--border); border-radius: 999px;
  padding: 1px 7px; margin-right: 6px; color: var(--text); }