/* Reseñas YPF — docs/sistema-de-diseno.md. Referencia visual (12/10/2026): tablero tipo TaskFlow.
   Estrellas en escala rojo ↔ gris ↔ azul (nunca verde); verde solo para «Resuelta», siempre con palabra. */
:root{
  color-scheme:dark;
  --fondo:#0b111a;--panel:#111926;--elevada:#172231;--borde:#223044;--borde-suave:#1b2738;
  --texto:#eef2f7;--muted:#a9b6c6;--apagado:#8090a6;
  --acento:#256abf;--acento-hover:#2c78d4;--acento-texto:#5598e7;--acento-suave:#16294a;
  --buena:#3987e5;--media:#7d8796;--mala:#e66767;
  --critica:#e05252;--aviso:#f0a92a;--resuelta:#33a474;
  /* círculos de los KPI y columnas del seguimiento */
  --ic-azul:#2d6fd0;--ic-violeta:#6e55d6;--ic-ambar:#c98912;--ic-indigo:#3f4fc4;
  --radio-s:8px;--radio-m:12px;--radio-l:16px;
  --sombra:0 1px 2px rgb(0 0 0 / .25);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:14px;
}
:root[data-theme="light"]{
  color-scheme:light;
  --fondo:#f3f5f8;--panel:#ffffff;--elevada:#f6f8fb;--borde:#dfe4eb;--borde-suave:#e9edf2;
  --texto:#0b0f14;--muted:#4b5563;--apagado:#6b7280;
  --acento:#256abf;--acento-hover:#1f5ca6;--acento-texto:#1f63b5;--acento-suave:#e5eefa;
  --buena:#2a78d6;--media:#8a929c;--mala:#d03b3b;
  --critica:#c93434;--aviso:#b7790c;--resuelta:#22855a;
  --sombra:0 1px 3px rgb(15 23 42 / .07);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--texto);line-height:1.5;overflow-x:hidden}
[hidden]{display:none!important}
a{color:var(--acento-texto);text-decoration:none}a:hover{text-decoration:underline}
button,input,select,textarea{font:inherit;color:var(--texto);background:var(--elevada);border:1px solid var(--borde);border-radius:var(--radio-s);padding:10px}
button{cursor:pointer;transition:border-color .15s,background .15s,color .15s}
button:hover{border-color:var(--acento-texto)}
button:disabled{opacity:.5;cursor:not-allowed}
:focus-visible{outline:3px solid var(--acento-texto);outline-offset:2px}
textarea{resize:vertical;width:100%}
label{display:grid;gap:6px;margin:6px 0;color:var(--muted);font-size:13px}
input,select{min-width:0;width:100%}input[type=checkbox]{width:auto}
p{line-height:1.6;color:var(--muted)}
h1,h2,h3{line-height:1.25;color:var(--texto)}
h1{font-size:28px}h2{font-size:20px}h3{font-size:16px}
small,.re-ayuda{color:var(--apagado);font-size:12px}
.rotulo{font-size:11px;letter-spacing:.06em;font-weight:600;color:var(--apagado);text-transform:uppercase;margin:20px 10px 8px}
.ico{width:18px;height:18px;flex:none}
.re-oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.re-apagado{color:var(--apagado)}

/* ---- barra superior ---- */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:0 20px;height:68px;background:var(--panel);border-bottom:1px solid var(--borde)}
.marca{display:flex;gap:10px;align-items:center;width:212px;flex:none}
.logo{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--acento);color:#fff}
.logo .ico{width:22px;height:22px}
.marca-tx{display:grid;line-height:1.25}.marca-tx b{font-size:17px}.marca-tx span{font-size:11.5px;color:var(--apagado)}
.re-buscar{display:flex;align-items:center;gap:8px;flex:1;max-width:520px;padding:0 14px;height:42px;border:1px solid var(--borde);border-radius:var(--radio-m);background:var(--elevada);color:var(--apagado)}
.re-buscar:focus-within{border-color:var(--acento-texto)}
.re-buscar input{border:0;background:transparent;padding:0;height:100%;outline:none}
.top-espacio{flex:1}
#reloj{font-variant-numeric:tabular-nums;color:var(--muted);font-size:13px}
.re-icono-boton{position:relative;display:grid;place-items:center;width:42px;height:42px;padding:0;border-radius:var(--radio-m);background:transparent;color:var(--muted)}
.re-icono-boton:hover{color:var(--texto);background:var(--elevada)}
.re-contador{position:absolute;top:4px;right:3px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--critica);color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center;border:2px solid var(--panel)}
.re-usuario{display:flex;align-items:center;gap:10px;padding-left:8px}
.re-usuario-tx{display:grid;line-height:1.25}.re-usuario-tx b{font-size:13.5px}.re-usuario-tx small{font-size:11.5px}
.re-avatar{display:inline-grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--acento);color:#fff;font-weight:700;font-size:14px}

/* ---- barra lateral ---- */
.re-sidebar{position:fixed;top:68px;bottom:0;left:0;width:232px;padding:6px 12px 16px;border-right:1px solid var(--borde);background:var(--panel);display:flex;flex-direction:column;overflow:auto}
.re-sidebar nav{display:grid;gap:4px}
.re-sidebar button{display:flex;align-items:center;gap:12px;background:transparent;text-align:left;border-color:transparent;font-size:14px;color:var(--muted);padding:11px 12px;border-radius:var(--radio-m)}
.re-sidebar button:hover{color:var(--texto);background:var(--elevada);border-color:transparent}
.re-sidebar button[aria-selected=true]{background:var(--acento);color:#fff;font-weight:600}
.re-modulos a{display:block;padding:9px 12px;border-radius:var(--radio-m);color:var(--muted);font-size:13.5px}
.re-modulos a:hover{background:var(--elevada);color:var(--texto);text-decoration:none}
.re-sidebar-pie{margin-top:auto;padding:14px 12px 0;border-top:1px solid var(--borde);display:grid;gap:10px;font-size:11.5px;color:var(--apagado);line-height:1.6}
.re-salir{color:var(--muted);font-size:13px}

/* ---- contenido ---- */
.re-main{margin-left:232px;padding:26px 28px 40px;min-width:0}
.re-main.re-cargando #seccion-resumen,.re-main.re-cargando #lista{opacity:.55;transition:opacity .2s}
.re-intro{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.re-intro h1{margin:0;font-size:30px;font-weight:700;letter-spacing:-.01em}.re-intro p{margin:4px 0 0}
.re-intro-der{display:grid;justify-items:end;gap:8px}
#fecha-larga{color:var(--muted);font-size:13px}
.re-periodo{display:flex;gap:8px;align-items:end;flex-wrap:wrap;justify-content:flex-end}
.re-periodo select{width:auto;padding:8px 12px;border-radius:var(--radio-m);font-size:13px}
.re-periodo label{margin:0;font-size:12px}.re-periodo input{padding:7px 10px}
.re-card,.re-kpi{background:var(--panel);border:1px solid var(--borde);border-radius:var(--radio-l);box-shadow:var(--sombra)}
.re-card{padding:20px;margin-bottom:16px;min-width:0}
.re-cab{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.re-cab h2{margin:0;font-size:17px;font-weight:650}.re-cab p{margin:2px 0 0;font-size:12.5px;color:var(--apagado)}
.re-vacio{color:var(--apagado);padding:18px 0;margin:0}
.re-ok{display:flex;align-items:center;gap:8px;color:var(--muted)}.re-ok .ico{color:var(--resuelta)}
.re-link{display:inline-flex;align-items:center;gap:6px;background:transparent;border:0;padding:4px 0;color:var(--acento-texto);font-size:13px;font-weight:600}
.re-link .ico{width:16px;height:16px}
.re-chip{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--elevada);border:1px solid var(--borde);font-size:11px;color:var(--muted);white-space:nowrap}

/* KPI */
.re-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:16px}
.re-kpi{display:flex;gap:14px;align-items:flex-start;padding:18px;min-width:0;min-height:112px}
.re-kpi-ico{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;color:#fff;flex:none}
.re-kpi-ico .ico{width:22px;height:22px}
.re-ic-azul{background:var(--ic-azul)}.re-ic-violeta{background:var(--ic-violeta)}.re-ic-ambar{background:var(--ic-ambar)}.re-ic-indigo{background:var(--ic-indigo)}
.re-kpi-tx{display:grid;gap:2px;min-width:0}
.re-kpi-rotulo{font-size:13px;color:var(--muted)}
.re-kpi strong{font-size:31px;font-weight:700;line-height:1.15;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.re-kpi-u{font-size:15px;font-weight:600;color:var(--muted);margin-left:2px}
.re-var{display:block;font-size:12px;color:var(--apagado)}
.re-var b{display:inline-flex;align-items:center;gap:3px;font-weight:650}
.re-flecha{width:14px;height:14px}
.re-var-buena{color:var(--buena)}.re-var-mala{color:var(--mala)}.re-var-neutra{color:var(--muted)}

/* grillas del tablero */
.re-grilla{display:grid;gap:16px;margin-bottom:0}
.re-grilla-a{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
.re-grilla-b{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}

/* Evolución */
.re-evolucion{position:relative}
.re-ref{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);flex-wrap:wrap}
.re-ref i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-left:6px}
.re-ref i:first-child{margin-left:0}
.re-ref-linea{background:var(--acento-texto)}
.re-ref i.re-ref-punteada{width:16px;height:0;border-radius:0;border-top:2px dashed var(--apagado)}
.re-ref i.re-c-buenas{background:var(--buena)}.re-ref i.re-c-medias{background:var(--media)}.re-ref i.re-c-malas{background:var(--mala)}
.re-grafico{display:block;width:100%;height:auto;overflow:visible;touch-action:pan-y}
.re-grafico text{fill:var(--apagado);font-size:11px}
.re-guia{stroke:var(--borde-suave);stroke-width:1}
.re-deg-a{stop-color:var(--acento-texto);stop-opacity:.42}
.re-deg-b{stop-color:var(--acento-texto);stop-opacity:0}
.re-linea{fill:none;stroke:var(--acento-texto);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.re-promedio{stroke:var(--apagado);stroke-width:1.5;stroke-dasharray:5 5}
.re-punto{fill:var(--acento-texto);stroke:var(--panel);stroke-width:2;transition:r .12s}
.re-punto.ultimo{fill:var(--panel);stroke:var(--acento-texto);stroke-width:3}
.re-punto.activo{r:6}
.re-zona{fill:transparent;cursor:crosshair}
.re-globo,.re-tip{position:absolute;pointer-events:none;background:var(--elevada);border:1px solid var(--borde);border-radius:10px;padding:7px 11px;font-size:12px;color:var(--muted);box-shadow:0 6px 18px rgb(0 0 0 / .25);white-space:nowrap}
.re-globo{transform:translate(-100%,calc(-100% - 12px));border-color:var(--acento-texto)}
.re-globo b{font-size:16px;color:var(--texto);margin-right:3px}.re-globo small{display:block;font-size:11px}
.re-tip{display:grid;gap:1px;transform:translate(10px,calc(-100% - 10px))}
.re-tip.a-izq{transform:translate(calc(-100% - 10px),calc(-100% - 10px))}
.re-tip b{color:var(--texto)}

/* Satisfacción */
.re-satis{display:grid;grid-template-columns:170px minmax(0,1fr);gap:22px;align-items:center}
.re-dona{position:relative;width:170px;height:170px}
.re-dona svg{width:100%;height:100%}
.re-arco,.re-arco-fondo{fill:none;stroke-width:17}
.re-arco-fondo{stroke:var(--elevada)}
.re-arco.re-c-buenas{stroke:var(--buena)}.re-arco.re-c-medias{stroke:var(--media)}.re-arco.re-c-malas{stroke:var(--mala)}
.re-dona-centro{position:absolute;inset:0;display:grid;place-content:center;text-align:center}
.re-dona-centro strong{font-size:40px;font-weight:700;line-height:1;letter-spacing:-.02em}
.re-dona-centro strong small{font-size:18px;color:var(--muted);font-weight:600}
.re-dona-centro span{font-size:13px;color:var(--muted);margin-top:4px}
.re-leyenda-lista{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.re-leyenda-lista li{display:grid;grid-template-columns:12px minmax(0,1fr) auto 46px;gap:10px;align-items:center;font-size:13.5px}
.re-leyenda-lista i{width:11px;height:11px;border-radius:50%}
.re-leyenda-lista span{display:grid;line-height:1.3}.re-leyenda-lista small{font-size:11.5px}
.re-leyenda-lista b{font-variant-numeric:tabular-nums;font-size:15px}
.re-leyenda-lista em{font-style:normal;color:var(--apagado);font-size:12px;text-align:right;font-variant-numeric:tabular-nums}
i.re-c-buenas{background:var(--buena)}i.re-c-medias{background:var(--media)}i.re-c-malas{background:var(--mala)}
.re-cambios{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--borde-suave);font-size:12.5px}
.re-cambios b{color:var(--texto);font-weight:600}

/* Por área */
#por-area{display:grid;gap:6px}
.re-area{display:grid;gap:7px;width:100%;text-align:left;background:transparent;border:1px solid transparent;border-radius:var(--radio-m);padding:9px 10px}
.re-area:hover{background:var(--elevada);border-color:transparent}
.re-area-cab{display:flex;justify-content:space-between;gap:10px;font-size:13.5px}
.re-area-cab>span{color:var(--apagado);font-size:12px;text-align:right}
.re-area-cab em{font-style:normal;color:var(--aviso);font-weight:600}
.re-area-barra{display:flex;gap:2px;height:12px;border-radius:6px;overflow:hidden}
.re-area-barra i{display:block;height:100%;min-width:3px}

/* Últimas reseñas */
.re-actividad{display:grid}
.re-act{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;text-align:left;background:transparent;border:0;border-bottom:1px solid var(--borde-suave);border-radius:0;padding:11px 4px}
.re-act:last-child{border-bottom:0}
.re-act:hover{background:var(--elevada);border-radius:var(--radio-s)}
.re-act-tx{display:grid;gap:2px;min-width:0}
.re-act-l1{display:flex;align-items:center;gap:8px;min-width:0}
.re-act-l1 b{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.re-act-l2{font-size:12.5px;color:var(--apagado);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.re-act-der{display:grid;justify-items:end;gap:4px}
.re-av-0{background:#2d6fd0}.re-av-1{background:#6e55d6}.re-av-2{background:#b8651c}.re-av-3{background:#23838a}
.re-av-4{background:#a8456f}.re-av-5{background:#4351c8}.re-av-6{background:#7a6418}.re-av-7{background:#5d6b7e}

/* estrellas (SVG, color por categoría) */
.re-estrellas{display:inline-flex;gap:1px;flex:none}
.re-estrellas svg{width:13px;height:13px;fill:var(--borde)}
.re-estrellas.re-buenas .llena{fill:var(--buena)}.re-estrellas.re-medias .llena{fill:var(--media)}.re-estrellas.re-malas .llena{fill:var(--mala)}

/* Por atender: pestañas pastilla y tabla */
.re-pastillas{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:var(--elevada);border:1px solid var(--borde);flex-wrap:wrap}
.re-pastillas button{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:999px;background:transparent;padding:6px 13px;font-size:13px;color:var(--muted)}
.re-pastillas button span{font-size:11.5px;padding:0 7px;border-radius:999px;background:var(--panel);color:var(--muted);font-variant-numeric:tabular-nums}
.re-pastillas button[aria-selected=true]{background:var(--acento);color:#fff;font-weight:600}
.re-pastillas button[aria-selected=true] span{background:rgb(255 255 255 / .2);color:#fff}
.re-tabla{width:100%;border-collapse:collapse;font-size:13px}
.re-tabla th{font-size:12px;color:var(--apagado);font-weight:500;text-align:left;padding:10px 12px;border-bottom:1px solid var(--borde)}
.re-tabla td{padding:12px;border-bottom:1px solid var(--borde-suave);vertical-align:middle}
.re-tabla tbody tr{cursor:pointer;transition:background .12s}
.re-tabla tbody tr:hover,.re-tabla tbody tr:focus-visible{background:var(--elevada)}
.re-tabla tbody tr:last-child td{border-bottom:0}
.re-persona{display:flex;align-items:center;gap:10px;min-width:0}
.re-persona>span{display:grid;min-width:0}.re-persona b{font-size:13.5px}
.re-persona small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:320px}
.re-plazo-vencido{display:inline-flex;align-items:center;gap:5px;color:var(--mala);font-weight:600}
.re-plazo-vencido .ico{width:15px;height:15px}
.re-estado{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;
  color:var(--c);background:color-mix(in srgb,var(--c) 15%,transparent);border:1px solid color-mix(in srgb,var(--c) 35%,transparent)}
.re-e-nueva{--c:var(--acento-texto)}.re-e-asignada{--c:#9a86ec}.re-e-respondida{--c:var(--aviso)}.re-e-resuelta{--c:var(--resuelta)}.re-e-descartada{--c:var(--apagado)}
:root[data-theme="light"] .re-e-asignada{--c:#5b43c4}

/* Seguimiento (kanban) */
.re-kanban{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.re-col{--c:var(--ic-azul);border-radius:var(--radio-m);padding:12px;background:color-mix(in srgb,var(--c) 9%,var(--panel));border:1px solid color-mix(in srgb,var(--c) 28%,var(--borde));min-width:0}
.re-col-asignada{--c:var(--ic-violeta)}.re-col-respondida{--c:var(--ic-ambar)}.re-col-resuelta{--c:var(--resuelta)}
.re-col header{display:flex;align-items:center;gap:8px;margin:2px 2px 12px}
.re-col header b{font-size:14px}
.re-num{font-size:11.5px;font-weight:700;padding:1px 8px;border-radius:999px;background:color-mix(in srgb,var(--c) 30%,var(--panel));color:var(--texto)}
.re-tarjeta{display:grid;gap:7px;width:100%;text-align:left;margin-bottom:8px;padding:11px 12px;background:var(--panel);border:1px solid var(--borde);border-radius:var(--radio-m)}
.re-tarjeta:hover{border-color:color-mix(in srgb,var(--c) 70%,var(--borde))}
.re-tarjeta-l1{display:flex;justify-content:space-between;align-items:center;gap:8px;min-width:0}
.re-tarjeta-l1 b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.re-tarjeta-l1 .re-avatar{width:26px;height:26px;font-size:12px}
.re-tarjeta-tx{font-size:12px;color:var(--apagado);line-height:1.45}
.re-tarjeta-pie{display:flex;justify-content:space-between;align-items:center;gap:8px}
.re-hecho{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--resuelta);color:#fff;flex:none}
.re-hecho .ico{width:14px;height:14px}
.re-col-vacia{font-size:12px;color:var(--apagado);margin:4px 2px 8px}
.re-mas{width:100%;background:transparent;border:1px dashed color-mix(in srgb,var(--c) 45%,var(--borde));border-radius:var(--radio-m);padding:8px;font-size:12.5px;color:var(--muted)}
.re-mas:hover{color:var(--texto)}

/* esqueletos (solo en la primera carga) */
.re-esqueleto{background:linear-gradient(90deg,var(--elevada) 25%,var(--borde-suave) 50%,var(--elevada) 75%);background-size:200% 100%;animation:re-brillo 1.4s ease-in-out infinite;border-radius:var(--radio-l);min-height:112px;border:0}
.re-alto{min-height:220px}
@keyframes re-brillo{from{background-position:200% 0}to{background-position:-200% 0}}

/* ---- bandeja, detalle, configuración, importar ---- */
.re-filtros{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:0 0 12px;padding:16px;border:1px solid var(--borde);border-radius:var(--radio-l);background:var(--panel)}
.re-filtros label{font-size:12px;flex:1 1 140px;margin:0}
.re-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.re-ancho{grid-column:1/-1}
.re-check{display:flex;align-items:center;gap:8px}
.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;font-weight:600;border-radius:var(--radio-m)}
.primario{background:var(--acento);border-color:var(--acento);color:#fff}
.primario:hover{background:var(--acento-hover);border-color:var(--acento-hover)}
.re-fantasma{background:transparent}
.re-acciones{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
/* avisos («Listo» o error): abajo al centro, se van solos */
.re-mensaje{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:80;width:min(560px,calc(100vw - 32px));margin:0;padding:14px 18px;background:var(--elevada);color:var(--texto);border:1px solid var(--acento-texto);border-left-width:4px;border-radius:var(--radio-m);box-shadow:0 12px 32px rgb(0 0 0 / .35);animation:re-entra .22s ease-out}
.re-mensaje.re-sale{opacity:0;transform:translate(-50%,8px);transition:opacity .2s,transform .2s}
@keyframes re-entra{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
.re-error{border-color:var(--critica);background:color-mix(in srgb,var(--critica) 16%,var(--panel))}
.re-muestra{background:#5b3f8f;color:#fff;padding:6px 10px;border-radius:var(--radio-s);font-size:12px;font-weight:600}
.re-fila{display:block;width:100%;text-align:left;margin:0 0 10px;padding:14px;background:var(--panel);border-radius:var(--radio-m)}
.re-fila>small{display:block;margin:6px 0}
.re-fila[aria-pressed=true]{border-color:var(--acento-texto);background:var(--acento-suave)}
.re-insignia{display:inline-block;padding:3px 9px;margin:3px 4px 3px 0;border-radius:999px;font-size:11px;font-weight:600;background:var(--elevada);border:1px solid var(--borde)}
.re-buenas{color:var(--buena)}.re-medias{color:var(--muted)}.re-malas{color:var(--mala)}
.re-vencida{color:#fff;background:var(--critica);border-color:var(--critica)}
.re-texto{white-space:pre-wrap;font-size:15px;color:var(--texto)}
.re-timeline{padding-left:20px}.re-timeline li{padding:8px 0}.re-timeline p{white-space:pre-wrap;font-size:12px}
.re-scroll{overflow:auto}
.re-help{font-size:11px;padding:0 6px;margin-left:4px;border-radius:50%;color:var(--muted);background:transparent}
table{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--borde);vertical-align:top}
th{color:var(--muted);font-weight:500;white-space:nowrap}
.re-manual{max-width:900px}.re-push{max-width:760px}
.re-contacto{border-top:1px solid var(--borde);padding:12px 0}.re-contacto.inactivo{opacity:.65}

/* ---- login (comparte este archivo) ---- */
.login-fondo{display:grid;place-items:center;min-height:100vh}
.login-caja{width:min(420px,92vw);padding:32px;border:1px solid var(--borde);background:var(--panel);border-radius:var(--radio-l)}
.login-caja button{width:100%;margin-top:16px;background:var(--acento);border-color:var(--acento);color:#fff}
.login-error{padding:12px;color:var(--mala)}

/* ---- tamaños ---- */
.re-bottom{display:none}
@media(max-width:1400px){.re-grilla-a{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}.re-satis{grid-template-columns:1fr;justify-items:center}.re-leyenda-lista{width:100%}}
@media(max-width:1200px){
  .re-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .re-kanban{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(240px,1fr);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}
  .re-col{scroll-snap-align:start}
  #reloj{display:none}
}
@media(max-width:1000px){.re-grilla-a,.re-grilla-b{grid-template-columns:minmax(0,1fr)}.re-satis{grid-template-columns:170px minmax(0,1fr);justify-items:stretch}.re-usuario-tx{display:none}}
@media(max-width:760px){
  .top{height:auto;flex-wrap:wrap;padding:10px 14px;gap:8px;position:sticky}
  .marca{width:auto;flex:1}.marca-tx span{display:none}
  .re-buscar{order:10;max-width:none;flex:1 1 100%;height:40px}
  .top-espacio{display:none}
  .re-sidebar{display:none}
  .re-main{margin:0;padding:18px 16px 96px}
  .re-intro{align-items:stretch;margin-bottom:16px}.re-intro h1{font-size:24px}.re-intro-der{grid-auto-flow:column;justify-content:space-between;align-items:center;width:100%}.re-periodo{justify-content:flex-end}
  .re-kpis{gap:10px}.re-kpi{flex-direction:column;gap:10px;padding:14px;min-height:0}.re-kpi-ico{width:40px;height:40px}.re-kpi-ico .ico{width:19px;height:19px}.re-kpi strong{font-size:26px}
  .re-card{padding:16px}
  .re-satis{grid-template-columns:1fr;justify-items:center}
  .re-kanban{grid-auto-columns:82%}
  .re-tabla thead{display:none}
  .re-tabla,.re-tabla tbody,.re-tabla tr,.re-tabla td{display:block;width:100%}
  /* cada fila, una tarjeta de tres líneas: autor + estado · área + estrellas · fecha + plazo */
  .re-tabla tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:12px 4px;border-bottom:1px solid var(--borde-suave)}
  .re-tabla td{padding:0;border:0;min-width:0;font-size:12.5px}
  .re-tabla td[data-l="Autor"]{grid-area:1/1}.re-tabla td[data-l="Estado"]{grid-area:1/2}
  .re-tabla td[data-l="Área"]{grid-area:2/1;color:var(--muted)}.re-tabla td[data-l="Estrellas"]{grid-area:2/2;justify-self:end}
  .re-tabla td[data-l="Publicada"]{grid-area:3/1;color:var(--apagado)}.re-tabla td[data-l="Plazo"]{grid-area:3/1/4/3;justify-self:end;text-align:right}
  .re-persona small{max-width:none}
  .re-form{grid-template-columns:1fr}
  .re-bottom{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--panel);border-top:1px solid var(--borde);padding:6px 6px max(8px,env(safe-area-inset-bottom));gap:4px}
  .re-bottom button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;background:transparent;border-color:transparent;font-size:11px;padding:6px 2px;color:var(--muted);border-radius:var(--radio-m)}
  .re-bottom button[aria-selected=true]{color:#fff;background:var(--acento)}
  .re-mensaje{bottom:84px}.re-ancho{grid-column:auto}
}

/* ---- lo primero del tablero: qué hay que hacer hoy ---- */
.re-accion-dia{display:flex;align-items:center;gap:16px;padding:18px 20px;margin-bottom:16px;border-radius:var(--radio-l);border:1px solid color-mix(in srgb,var(--c) 40%,var(--borde));background:color-mix(in srgb,var(--c) 10%,var(--panel))}
.re-accion-dia>.ico{width:30px;height:30px;color:var(--c);flex:none}
.re-accion-dia>div:not(.re-accion-botones){flex:1;min-width:0}.re-accion-dia b{font-size:16px}.re-accion-dia p{margin:3px 0 0;font-size:13px}
.re-accion-botones{display:flex;gap:8px;flex-wrap:wrap;flex:none}
.re-tono-rojo{--c:var(--mala)}.re-tono-ambar{--c:var(--aviso)}.re-tono-azul{--c:var(--acento-texto)}.re-tono-ok{--c:var(--resuelta)}.re-tono-neutro{--c:var(--apagado)}
.re-pastilla-accion{border:0;border-radius:999px;background:var(--acento);color:#fff;font-weight:600;font-size:13px;padding:6px 14px}
.re-contador-nav{margin-left:auto;min-width:20px;padding:0 6px;border-radius:999px;background:var(--critica);color:#fff;font-size:11px;font-weight:700;line-height:20px;text-align:center}
.re-bottom .re-contador-nav{position:absolute;top:2px;left:calc(50% + 6px);margin:0;line-height:17px;min-width:17px;font-size:10px}
.re-bottom button{position:relative}

/* ---- bandeja ---- */
.re-bandeja-cab{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.re-vistas{max-width:100%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.re-vistas::-webkit-scrollbar{display:none}
.re-vistas button{white-space:nowrap}
.re-filtro-buscar{flex:1 1 320px}
.re-mas-filtros{flex:1 1 100%}.re-mas-filtros summary{cursor:pointer;color:var(--acento-texto);font-size:13px;font-weight:600;width:max-content}
.re-mas-filtros-campos{display:flex;gap:12px;flex-wrap:wrap;align-items:end;margin-top:10px}.re-mas-filtros-campos label{flex:1 1 160px;margin:0}
.re-lista{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:12px}
.re-item{display:grid;gap:10px;width:100%;text-align:left;padding:14px 16px;background:var(--panel);border:1px solid var(--borde);border-left:4px solid var(--c);border-radius:var(--radio-l);box-shadow:var(--sombra);transition:transform .15s,border-color .15s,box-shadow .15s}
.re-item:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--c) 60%,var(--borde));box-shadow:0 8px 24px rgb(0 0 0 / .18)}
.re-borde-buenas{--c:var(--buena)}.re-borde-medias{--c:var(--media)}.re-borde-malas{--c:var(--mala)}
.re-item-cab{display:flex;align-items:center;gap:10px;min-width:0}
.re-item-quien{display:grid;flex:1;min-width:0}.re-item-quien b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.re-item-quien>span{display:flex;align-items:center;gap:8px}
.re-item-texto{font-size:13.5px;color:var(--muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.re-item-pie{display:flex;justify-content:space-between;align-items:center;gap:8px}
.re-item-accion{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:650;color:var(--acento-texto)}
.re-item-accion .ico{width:16px;height:16px;transition:transform .15s}.re-item:hover .re-item-accion .ico{transform:translateX(3px)}
.re-acc-rojo{color:var(--mala)}.re-acc-ambar{color:var(--aviso)}.re-acc-neutro{color:var(--muted)}
.re-estado .ico{width:13px;height:13px;margin-right:4px;vertical-align:-2px}
.re-e-vencida{--c:var(--mala)}
.re-vacio-grande{grid-column:1/-1;text-align:center;padding:48px 16px;border:1px dashed var(--borde);border-radius:var(--radio-l)}
.re-vacio-grande .ico{width:36px;height:36px;color:var(--resuelta)}.re-vacio-grande h3{margin:10px 0 4px}.re-vacio-grande p{margin:0 auto;max-width:460px}

/* ---- panel de atención: entra desde la derecha; en el celular, pantalla completa ---- */
body.re-con-panel{overflow:hidden}
/* con el panel abierto, el aviso va arriba para no tapar el botón del paso */
body.re-con-panel .re-mensaje{top:16px;bottom:auto!important}
.re-panel{position:fixed;inset:0;z-index:60;background:rgb(3 7 13 / 0);transition:background .22s}
.re-panel.abierto{background:rgb(3 7 13 / .55)}
.re-panel-caja{position:absolute;top:0;right:0;bottom:0;width:min(600px,100vw);display:flex;flex-direction:column;background:var(--fondo);border-left:1px solid var(--borde);box-shadow:-20px 0 50px rgb(0 0 0 / .35);transform:translateX(100%);transition:transform .24s cubic-bezier(.2,.8,.2,1)}
.re-panel.abierto .re-panel-caja{transform:none}
.re-panel-cab{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--borde);background:var(--panel)}
.re-panel-nav{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.re-panel-rotulo{font-size:12.5px;color:var(--apagado);padding-left:6px}
.re-panel-cuerpo{flex:1;overflow:auto;padding:20px 22px 28px;overscroll-behavior:contain}
.re-panel-pie{padding:14px 22px max(14px,env(safe-area-inset-bottom));border-top:1px solid var(--borde);background:var(--panel)}
.re-grande{width:100%;padding:14px 18px;font-size:15px}
.re-consecuencia{margin:8px 0 0;font-size:12px;color:var(--apagado);text-align:center}
.re-quien{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.re-quien h2{margin:0;font-size:21px;outline:none}.re-quien p{margin:4px 0 0;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px}
.re-quien .re-estrellas svg{width:16px;height:16px}
.re-avatar-grande{width:48px;height:48px;font-size:19px}
.re-estado-barra{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--radio-m);border:1px solid color-mix(in srgb,var(--c) 40%,var(--borde));background:color-mix(in srgb,var(--c) 11%,var(--panel));margin-bottom:16px}
.re-estado-barra>.ico{width:22px;height:22px;color:var(--c);margin-top:1px}
.re-estado-barra b{font-size:15px}.re-estado-barra p{margin:3px 0 0;font-size:13px}
.re-pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;list-style:none;padding:0;margin:0 0 18px;counter-reset:p}
.re-pasos li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--apagado);padding:8px 10px;border-radius:var(--radio-s);background:var(--panel);border:1px solid var(--borde-suave);line-height:1.25}
.re-pasos li>span{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;border:2px solid var(--borde);font-size:12px;font-weight:700}
.re-pasos li>span .ico{width:14px;height:14px}
.re-paso-actual{color:var(--texto)!important;border-color:var(--acento-texto)!important;background:var(--acento-suave)!important;font-weight:600}
.re-paso-actual>span{border-color:var(--acento-texto)!important;background:var(--acento);color:#fff}
.re-paso-hecho>span{border-color:var(--resuelta)!important;background:var(--resuelta);color:#fff}
.re-cita{margin:0 0 16px;padding:14px 16px;border-left:3px solid var(--borde);background:var(--panel);border-radius:0 var(--radio-m) var(--radio-m) 0;font-size:15px;line-height:1.6;white-space:pre-wrap;color:var(--texto)}
.re-respuesta{margin:0 0 16px 18px;padding:12px 14px;border-radius:var(--radio-m);background:var(--acento-suave);border:1px solid color-mix(in srgb,var(--acento-texto) 30%,var(--borde))}
.re-respuesta p{margin:4px 0 0;color:var(--texto);white-space:pre-wrap}
.re-bloque{margin:0 0 18px}.re-bloque h3{margin:0 0 10px;font-size:15px}
.re-bloque textarea{background:var(--panel);font-size:15px;line-height:1.55;padding:12px 14px;border-radius:var(--radio-m)}
.re-bloque textarea:focus{border-color:var(--acento-texto)}
.re-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.re-chip-boton{border-radius:999px;padding:7px 13px;font-size:13px;background:var(--panel)}
.re-chip-boton:hover{background:var(--acento-suave)}
.re-google{padding:14px 16px;border-radius:var(--radio-m);background:var(--panel);border:1px dashed var(--borde)}
.re-google p{margin:0 0 8px;font-size:13px}
.re-dos{margin:0;padding-left:20px;font-size:13.5px;color:var(--muted);display:grid;gap:6px}.re-dos b{color:var(--texto)}
.re-dos-actual{color:var(--texto)}.re-dos-actual::marker{color:var(--acento-texto);font-weight:700}.re-dos-hecho{text-decoration:line-through;text-decoration-color:var(--apagado)}
.re-link-chico{display:inline;border:0;background:none;padding:0;color:var(--acento-texto);font-size:12px;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.re-listo{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;margin-bottom:16px;border-radius:var(--radio-m);background:color-mix(in srgb,var(--resuelta) 13%,var(--panel));border:1px solid color-mix(in srgb,var(--resuelta) 45%,var(--borde));animation:re-aparece .3s ease-out}
.re-listo>.ico{width:24px;height:24px;color:var(--resuelta)}.re-listo b{font-size:15px}.re-listo p{margin:3px 0 10px;font-size:13px}
@keyframes re-aparece{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.re-mas-acciones,.re-historial{margin:0 0 14px;border:1px solid var(--borde);border-radius:var(--radio-m);background:var(--panel);padding:0 14px}
.re-mas-acciones summary,.re-historial summary{cursor:pointer;padding:12px 0;font-weight:600;font-size:14px}
.re-mas-acciones[open],.re-historial[open]{padding-bottom:12px}
.re-fila-campo{display:flex;gap:8px}.re-fila-campo .boton{flex:none}
.re-peligro{color:var(--mala);border-color:color-mix(in srgb,var(--mala) 50%,var(--borde))}
.re-timeline{list-style:none;padding:0;margin:0;border-left:2px solid var(--borde);display:grid;gap:12px}
.re-timeline li{position:relative;padding:0 0 0 16px}.re-timeline li::before{content:"";position:absolute;left:-6px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--acento-texto);border:2px solid var(--panel)}
.re-timeline small{display:block}.re-timeline b{font-size:13px}.re-timeline p{margin:2px 0 0;white-space:pre-wrap;font-size:12.5px}
.re-solo-lectura{display:flex;gap:8px;align-items:center;padding:12px;border-radius:var(--radio-m);background:var(--panel)}
.re-google-link{margin-top:4px}
.re-falta{border-color:var(--mala)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--mala) 25%,transparent)}
.boton.re-ocupado{position:relative;color:transparent!important}
.boton.re-ocupado::after{content:"";position:absolute;width:18px;height:18px;border:2px solid #fff;border-right-color:transparent;border-radius:50%;animation:re-gira .7s linear infinite}
@keyframes re-gira{to{transform:rotate(360deg)}}
@media(max-width:760px){
  .re-accion-dia{flex-wrap:wrap;padding:16px}.re-accion-botones{width:100%}.re-accion-botones .boton{flex:1}
  .re-bandeja-cab #responder-en-fila{width:100%}
  .re-lista{grid-template-columns:minmax(0,1fr)}
  .re-panel-caja{width:100vw;border-left:0;transform:translateY(100%)}
  .re-panel-cuerpo{padding:16px 16px 24px}.re-panel-pie{padding:12px 16px max(12px,env(safe-area-inset-bottom))}
  .re-pasos{grid-template-columns:1fr;gap:4px}.re-pasos li{padding:6px 10px}
  .re-fila-campo{flex-direction:column}
}
/* IA */
.re-chip-ia{border-color:color-mix(in srgb,var(--acento-texto) 55%,var(--borde));color:var(--acento-texto);font-weight:600;display:inline-flex;align-items:center;gap:6px}
.re-chip-ia .ico{width:15px;height:15px}
.re-cargando-ia{opacity:.7}.re-cargando-ia .ico{animation:re-gira 1.2s linear infinite}
.re-ia-nota{margin:-2px 0 8px;color:var(--acento-texto)}
.re-recien{animation:re-destello .9s ease-out}
@keyframes re-destello{from{box-shadow:0 0 0 3px color-mix(in srgb,var(--acento-texto) 45%,transparent)}to{box-shadow:none}}
#temas,#personal{display:grid;gap:8px}
.re-tema{display:grid;gap:6px;padding:6px 4px}
.re-persona-fila{display:flex;align-items:center;gap:10px;padding:6px 4px;border-bottom:1px solid var(--borde-suave)}
.re-persona-fila:last-child{border-bottom:0}.re-persona-fila .re-avatar{width:30px;height:30px;font-size:13px}
.re-persona-num{margin-left:auto;display:flex;gap:10px;font-size:12.5px;font-weight:600}
/* clasificar a mano */
.re-clasificar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 10px;border-radius:var(--radio-m);background:var(--elevada);border:1px dashed var(--borde)}
.re-clasificar small{width:100%;font-weight:600;color:var(--muted)}
.re-clasificar .re-chip-boton{padding:6px 12px}
.re-sale-tarjeta{opacity:0;transform:scale(.97);transition:opacity .25s,transform .25s}
.re-sector{display:flex;align-items:center;gap:10px;margin:0 0 4px;font-weight:600;color:var(--texto)}
.re-sector select{width:auto;flex:1;max-width:260px;padding:8px 12px;border-radius:var(--radio-m)}
.re-sector+.re-ayuda{margin:0 0 14px}
/* enlace directo al comentario en Google (en tarjetas, tabla, panel) */
.re-en-google{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:600;color:var(--acento-texto);white-space:nowrap;padding:2px 2px;border-radius:6px}
.re-en-google .ico{width:13px;height:13px}
.re-en-google:hover{text-decoration:underline}
.re-item,.re-act,.re-tarjeta{cursor:pointer}
.re-item:focus-visible,.re-act:focus-visible,.re-tarjeta:focus-visible{outline:3px solid var(--acento-texto);outline-offset:2px}
.re-item-pie-izq,.re-act-chips{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.re-cita-enlace{margin:-8px 0 16px}
.re-persona .re-en-google{margin-left:auto}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}