/* tesora/public/style.css — Design system "Terminal de datos" */
:root{
  --bg:#0a0d10; --panel:#0d1117; --panel2:#11161c; --border:#1c2128;
  --tx:#c9d1d9; --dim:#8b949e; --blue:#58a6ff; --green:#3fb950; --amber:#e6b450; --red:#f85149;
  --mono:'Consolas','SF Mono',ui-monospace,monospace; --sans:'Inter',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{background:var(--bg);min-height:100%}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--tx);font-family:var(--sans);font-size:13px;-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-decoration:none} a:hover{text-decoration:underline}
.num,.tnum{font-family:var(--mono);font-variant-numeric:tabular-nums}
/* top bar */
.topbar{display:flex;align-items:center;gap:16px;padding:9px 18px;background:var(--panel);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:20}
.brand{font-family:var(--mono);font-weight:700;letter-spacing:.22em;color:var(--amber);font-size:15px}
.brand small{color:var(--dim);font-weight:400;letter-spacing:.1em;font-size:10px;margin-left:6px}
.datesel{font-family:var(--mono);background:var(--panel2);border:1px solid var(--border);color:var(--tx);padding:4px 10px;border-radius:3px;cursor:pointer}
.reportage{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;color:var(--dim)}
.ra-time{color:var(--tx)}
.ra-tz{color:var(--dim);font-size:.85em}   /* zona horaria del informe: visible, sin gritar */
/* Chivato de subasta: discreto a 6h, parpadeando en la última hora. */
.avisosub{margin-left:10px;padding:2px 8px;border-radius:4px;font-family:var(--mono);font-size:11px;white-space:nowrap}
.avisosub.suave{background:rgba(245,158,11,.15);color:var(--amber)}
.avisosub.fuerte{background:rgba(239,68,68,.18);color:var(--red);animation:avisoParpadeo 1.2s ease-in-out infinite}
@keyframes avisoParpadeo{0%,100%{opacity:1}50%{opacity:.45}}
.ra-age.fresh{color:var(--green)} .ra-age.mid{color:var(--amber)} .ra-age.stale{color:var(--red)}
.live{display:flex;align-items:center;gap:6px;color:var(--green);font-family:var(--mono);font-size:11px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--green);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(63,185,80,.5)}70%{box-shadow:0 0 0 7px rgba(63,185,80,0)}100%{box-shadow:0 0 0 0 rgba(63,185,80,0)}}
/* Señalar 3s la fila a la que se ha saltado desde la Conclusión: verde=comprar, rojo=pasar. */
@keyframes flashVerde{0%{background:rgba(63,185,80,.55)}100%{background:transparent}}
@keyframes flashRojo{0%{background:rgba(248,81,73,.5)}100%{background:transparent}}
tr.flash-green>td{animation:flashVerde 3s ease-out}
tr.flash-red>td{animation:flashRojo 3s ease-out}
.stats{margin-left:auto;display:flex;gap:14px;color:var(--dim);font-family:var(--mono);font-size:11px}
.stats b{color:var(--tx)} .stats .bad{color:var(--red)}
.stats .statlink{cursor:pointer} .stats .statlink:hover{color:var(--tx)}
.langsel{display:inline-flex;border:1px solid var(--border);border-radius:4px;overflow:hidden;font-family:var(--mono)}
.langbtn{background:transparent;color:var(--dim);border:0;padding:5px 9px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.06em;cursor:pointer}
.langbtn:hover{color:var(--tx)}
.langbtn.on{background:var(--amber);color:#0c0e12}
.runbtn{background:#152b1c;color:var(--green);border:1px solid #2ea04326;padding:6px 14px;border-radius:3px;font-family:var(--mono);font-size:12px;cursor:pointer}
.runbtn:hover{background:#1c3a26} .runbtn:disabled{opacity:.5;cursor:default}
/* tabs */
.tabs{display:flex;gap:1px;padding:0 10px;background:var(--panel);border-bottom:1px solid var(--border);overflow-x:auto;white-space:nowrap;position:sticky;top:41px;z-index:19}
.tab{padding:9px 14px;color:var(--dim);cursor:pointer;font-size:12px;border-bottom:2px solid transparent;flex:0 0 auto}
.tab:hover{color:var(--tx)} .tab.on{color:var(--tx);border-bottom-color:var(--amber)}
.tab .n{color:var(--dim);font-family:var(--mono);font-size:10px;margin-left:4px} .tab.on .n{color:var(--amber)}
.degbanner{background:#3a2a12;border-bottom:1px solid var(--amber);color:#f0c674;padding:8px 16px;font-size:13px}
.degbanner a{color:var(--amber);text-decoration:underline}
.degbanner.hidden{display:none}
/* espaciador + menú ⋮ (pestañas secundarias a la derecha) */
.tabspacer{flex:1 1 auto;min-width:8px}
.tab.kebab{font-size:17px;line-height:1;padding:7px 12px}
.tab.kebab.on{color:var(--amber)}
.kebabmenu{display:none;position:fixed;background:var(--panel);border:1px solid var(--border);border-radius:7px;padding:5px;min-width:180px;z-index:40;box-shadow:0 10px 30px rgba(0,0,0,.55)}
.kebabmenu.on{display:block}
.kmi{padding:9px 12px;color:var(--dim);cursor:pointer;border-radius:4px;font-size:12.5px;white-space:nowrap}
.kmi:hover{background:var(--panel2);color:var(--tx)}
.kmi.on{color:var(--amber)}
/* filters */
.filters{display:flex;gap:8px;padding:11px 18px;flex-wrap:wrap;align-items:center;border-bottom:1px solid var(--border)}
.flabel{color:var(--dim);font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.chip{font-family:var(--mono);font-size:11px;padding:4px 10px;border:1px solid var(--border);border-radius:20px;color:var(--dim);cursor:pointer;background:var(--panel)}
.chip.on{color:var(--bg);background:var(--amber);border-color:var(--amber);font-weight:600}
.chip.on.red{background:var(--red);border-color:var(--red)} .chip.on.green{background:var(--green);border-color:var(--green)}
/* content + tables */
.wrap{padding:14px 18px 60px;overflow-x:auto}
.sechead{display:flex;align-items:baseline;gap:10px;margin:6px 0 10px}
.sechead h3{margin:0;font-size:14px;color:var(--tx)} .sechead .desc{color:var(--dim);font-size:11px}
table{border-collapse:collapse;font-size:12.5px;min-width:100%}
thead th{text-align:left;color:var(--dim);font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;font-weight:600;padding:7px 10px;border-bottom:1px solid var(--border);white-space:nowrap;cursor:pointer;position:relative}
thead th.r{text-align:right}
tbody td{padding:8px 10px;border-bottom:1px solid #12171d;white-space:nowrap}
tbody tr:hover{background:var(--panel2)} tbody tr.closed{opacity:.4}
td.r{text-align:right}
.dom{color:var(--blue)} .star{color:#30363d;cursor:pointer;margin-right:7px} .star.on{color:var(--amber)}
.traf{color:var(--green);font-family:var(--mono)} .traf.zero{color:var(--dim)}
.cd{font-family:var(--mono);font-weight:600} .cd.d{color:var(--green)} .cd.h{color:var(--amber)} .cd.u{color:var(--red)}
.badge{font-family:var(--mono);font-size:10px;padding:2px 6px;border-radius:2px}
.b-nobid{background:#132b1a;color:var(--green)} .b-bid{background:#2b1616;color:var(--red)}
.warn{color:var(--amber)} .val{font-family:var(--mono)}
/* Valoración de GoDaddy degradada (Opción B): gris + etiqueta "estim." + tono apagado. Medida ruido. */
.gd-estim{color:var(--dim);opacity:.82;cursor:help}
.estimtag{font-size:9px;text-transform:uppercase;letter-spacing:.4px;color:var(--dim);border:1px solid var(--border);border-radius:4px;padding:0 4px;margin-left:2px;vertical-align:middle;font-family:var(--sans,inherit)}
/* AS = semáforo blando: verde suave si autoridad alta (mejor señal de pujas). No es una puerta. */
.v1.as-hi{color:var(--green)} .v1.as-mid{color:#7ea88a}
.live-on{color:var(--green);font-size:10px} .live-off{color:var(--dim);font-size:10px}
a.live-link{cursor:pointer;text-decoration:none} a.live-link:hover{text-decoration:underline;filter:brightness(1.2)}
.lnk{color:var(--dim);margin:0 2px} .lnk:hover{color:var(--blue)}
.lsep{color:#3d444d;font-style:normal}

/* Marca de cómo se compra. Solo aparece en la EXCEPCIÓN (reserva): la subasta es la norma y
   etiquetarla sería ruido. Ver como-se-compra.js. */
.tag-compra{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:10px;font-size:10px;
  background:rgba(88,166,255,.12);color:var(--blue);border:1px solid rgba(88,166,255,.3);
  vertical-align:1px;cursor:help;white-space:nowrap}
/* Color del chip por forma de compra: subasta (pujar)=ámbar · reserva=azul · closeout=morado ·
   ya libre=verde · va a caer=gris. Así se distingue el proveedor de un vistazo. */
.tag-compra.tag-subasta{background:rgba(210,153,34,.12);color:var(--amber);border-color:rgba(210,153,34,.35)}
.tag-compra.tag-closeout{background:rgba(163,113,247,.12);color:#a371f7;border-color:rgba(163,113,247,.35)}
.tag-compra.tag-libre{background:rgba(63,185,80,.12);color:var(--green);border-color:rgba(63,185,80,.35)}
.tag-compra.tag-pre{background:var(--panel2);color:var(--dim);border-color:var(--border)}
/* Banner "de dónde sale y cómo se pilla" en el cajón de detalle (rectángulo derecho). */
.drw-compra{display:block;margin:8px 0 2px;padding:8px 11px;border-radius:6px;background:var(--panel2);
  border-left:3px solid var(--dim);color:var(--tx);font-size:11.5px;line-height:1.45}
.drw-compra b{font-weight:700}
.drw-compra.tag-subasta{border-left-color:var(--amber)} .drw-compra.tag-subasta b{color:var(--amber)}
.drw-compra.tag-reserva{border-left-color:var(--blue)} .drw-compra.tag-reserva b{color:var(--blue)}
.drw-compra.tag-closeout{border-left-color:#a371f7} .drw-compra.tag-closeout b{color:#a371f7}
.drw-compra.tag-libre{border-left-color:var(--green)} .drw-compra.tag-libre b{color:var(--green)}
.drw-compra.tag-pre{border-left-color:var(--dim)} .drw-compra.tag-pre b{color:var(--dim)}

/* Fila de enlaces DENTRO de la ficha: aquí sí se agranda. En la tabla se queda pequeña —la misma
   función la pinta en los dos sitios— porque ahí hay una por fila y engordarla dispararía el alto.
   En la ficha es una sola y son los accesos a las fuentes: tienen que verse y ser fáciles de dar. */
.drw-links{margin-top:14px;padding:5px 4px;background:var(--panel2);border:1px solid var(--border);
  border-radius:5px;font-size:15px;line-height:1.5;text-align:center}
.drw-links .lnk{margin:0;padding:3px 6px;border-radius:4px;text-decoration:none;transition:background .12s}
.drw-links .lnk:hover{background:rgba(88,166,255,.16)}
/* "SR" es texto, no emoji: al mismo tamaño se comería a los iconos de al lado. */
.drw-links .lnk[title="Semrush"]{font-size:12px;font-weight:700;color:var(--tx);letter-spacing:.04em;
  vertical-align:1px}
.drw-links .est:hover{background:rgba(210,153,34,.2)}
.drw-links .lsep{font-size:11px;margin:0}
/* info tooltip */
.info{position:relative;color:#6e7681;cursor:help;font-size:10px;margin-left:4px;border:1px solid #30363d;border-radius:50%;width:13px;height:13px;display:inline-flex;align-items:center;justify-content:center;line-height:1}
.info:hover{color:var(--amber);border-color:var(--amber)}
.info .tip{display:none;position:absolute;top:20px;left:0;width:240px;background:#161b22;border:1px solid var(--amber);border-radius:5px;padding:9px 11px;color:var(--tx);font-size:11px;font-weight:400;letter-spacing:normal;text-transform:none;line-height:1.5;z-index:40;box-shadow:0 6px 22px rgba(0,0,0,.6);white-space:normal;text-align:left}
.info:hover .tip{display:block} .info .tip b{color:var(--amber)}
.info .tip.tipr{left:auto;right:0}   /* tooltips de la barra de stats: abren hacia la izquierda para no salirse */
/* Explicación larga (la de "recalcular con IA"): 240px se quedan cortos y salía un churro
   estrechísimo de 20 líneas. Con el doble de ancho se lee de un vistazo. */
.info .tip.tipancho{width:420px;font-size:11.5px}
.stats .info{border-color:#3d444d}
/* conclusion (Resumen) */
.concl{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:16px 18px;margin-bottom:18px}
.concl h2{margin:0 0 10px;font-size:15px;color:var(--amber)}
.joya{background:#141a0f;border:1px solid #3d3a1a;border-radius:5px;padding:10px 12px;margin-bottom:12px}
.joya b{color:var(--amber)}
.concl ul{margin:6px 0;padding-left:18px} .concl li{margin:3px 0;line-height:1.5}
.aviso{color:var(--amber);font-size:12px;margin:4px 0}
/* run panel */
.runpanel{position:fixed;right:18px;bottom:18px;width:340px;background:var(--panel);border:1px solid var(--amber);border-radius:6px;padding:12px 14px;font-family:var(--mono);font-size:11px;z-index:50;box-shadow:0 8px 30px rgba(0,0,0,.6)}
.runpanel.hidden{display:none}
.runlog{max-height:120px;overflow:auto;color:var(--dim);margin-top:8px;white-space:pre-wrap}
.bar{height:6px;background:var(--panel2);border-radius:3px;overflow:hidden;margin-top:6px}
.bar > div{height:100%;background:var(--green);width:0}
/* drawer detalle */
.drawer{position:fixed;top:0;right:0;height:100%;width:380px;background:var(--panel);border-left:1px solid var(--border);padding:18px;overflow:auto;transform:translateX(100%);transition:transform .18s;z-index:60}
.drawer.on{transform:none}
.drawer .close{float:right;color:var(--dim);cursor:pointer}
.drawer .close:hover{color:var(--red)}
/* Segundo "cerrar" al FINAL de la ficha: es larga, y volver arriba solo para cerrarla es un paseo.
   En rojo y a todo el ancho para que se vea sin buscarlo. */
.cerrar-abajo{display:block;width:100%;margin-top:20px;padding:9px;cursor:pointer;
  background:rgba(248,81,73,.12);color:var(--red);border:1px solid var(--red);border-radius:4px;
  font-family:var(--sans);font-size:12.5px;font-weight:600;transition:background .12s}
.cerrar-abajo:hover{background:rgba(248,81,73,.24)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:12px;margin-top:10px}
.kv .k{color:var(--dim)} .kv .v{font-family:var(--mono);text-align:right}
.note-in{width:100%;background:var(--panel2);border:1px solid var(--border);color:var(--tx);padding:6px;border-radius:3px;margin-top:6px;font-family:var(--sans)}
/* botón Filtros dentro de la barra de pestañas + chips */
.filtbtn.on{color:var(--amber);border-bottom-color:var(--amber)}
.fcount{background:var(--amber);color:var(--bg);border-radius:10px;padding:0 6px;font-weight:600;font-size:10px;margin-left:4px}
.carat{color:var(--dim);margin-left:2px}
.chip.clr{color:var(--dim);border-style:dashed}
/* Iconos SVG (embudo de Filtros, lupa del buscador): heredan el color del texto de al lado. */
.ico{width:11px;height:11px;vertical-align:-1px;margin-right:3px}

/* BUSCADOR — va antes de Filtros. Discreto en reposo; se enciende en ámbar cuando hay texto,
   para que se note de un vistazo que la tabla está recortada por una búsqueda. */
.srch{display:flex;align-items:center;gap:2px;background:var(--panel2);border:1px solid var(--border);
  border-radius:4px;padding:0 7px;margin:0 8px;height:25px;align-self:center;transition:border-color .12s}
.srch .lupa{color:var(--dim);margin-right:1px;flex:none}
.srch:focus-within{border-color:var(--amber)}
.srch:focus-within .lupa,.srch.con .lupa{color:var(--amber)}
.srch.con{border-color:var(--amber)}
.srch input{background:none;border:0;outline:0;color:var(--tx);font-family:var(--sans);font-size:11.5px;
  width:130px;padding:0}
.srch input::placeholder{color:var(--dim)}
.srch input::-webkit-search-cancel-button{display:none}   /* la ✕ la ponemos nosotros */
.qclr{color:var(--dim);cursor:pointer;font-size:11px;padding:0 1px;visibility:hidden}
.srch.con .qclr{visibility:visible}
.qclr:hover{color:var(--red)}
/* Coletilla bajo un título del Resumen: explica QUÉ criterio manda en esa lista, para que no se
   confunda "cierra ya" (oportunidad) con "lo mejor del día" (calidad). */
.sublabel{display:block;color:var(--dim);font-size:11px;font-weight:400;margin:2px 0 6px}
.lnkin{color:var(--amber);text-decoration:none;border-bottom:1px dotted var(--amber)}
.lnkin:hover{border-bottom-style:solid}

/* Aviso de "no hay nada con ese texto": no dejar la tabla vacía y muda. */
.sinres{color:var(--dim);padding:18px 2px;font-size:13px}
.sinres b{color:var(--amber)}

/* Tira "también aparece en otros días": lo que buscas puede ser de un informe anterior.
   Cada resultado lleva su fecha y salta a ese día al pulsarlo. */
.otrosdias{margin-top:14px;padding:10px 12px;background:var(--panel);border:1px solid var(--border);
  border-left:2px solid var(--amber);border-radius:4px;font-size:12px;line-height:2}
.otrosdias .odh{color:var(--dim);margin-right:6px}
.otrosdias .odi{display:inline-block;margin:0 5px 0 0;padding:2px 7px;background:var(--panel2);
  border:1px solid var(--border);border-radius:3px;color:var(--tx);text-decoration:none;font-family:var(--mono);font-size:11px}
.otrosdias .odi em{color:var(--amber);font-style:normal;margin-left:4px}
.otrosdias .odi:hover{border-color:var(--amber)}
/* Lo que está HOY en otra pestaña se marca en verde: no hace falta cambiar de día, solo de pestaña. */
.otrosdias .odi.hoy em{color:var(--green)}
/* gestor de nichos */
.nichemgr{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:12px 14px;margin-bottom:14px}
.nm-head{font-size:13px;color:var(--tx);margin-bottom:10px}
.nm-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.nchip{font-family:var(--mono);font-size:12px;background:var(--panel2);border:1px solid var(--border);border-radius:20px;padding:4px 6px 4px 12px;color:var(--tx);display:inline-flex;align-items:center;gap:6px}
.nx{color:var(--dim);cursor:pointer;border-radius:50%;width:15px;height:15px;display:inline-flex;align-items:center;justify-content:center;font-size:10px}
.nx:hover{background:var(--red);color:#fff}
.nadd{display:inline-flex;align-items:center;gap:6px}
.nadd .note-in{margin-top:0}
.mini{background:#152b1c;color:var(--green);border:1px solid #2ea04326;padding:6px 12px;border-radius:3px;font-family:var(--mono);font-size:11px;cursor:pointer}
.mini:hover{background:#1c3a26}
/* panel de configuración */
.cfg-sec{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:14px 16px;margin-bottom:14px}
.cfg-h{font-size:13px;color:var(--tx);margin-bottom:12px}
.cfg-row{display:flex;align-items:center;gap:12px;padding:6px 0;border-bottom:1px solid #12171d}
.cfg-em{font-family:var(--mono);color:var(--tx)}
.cfg-quota{font-family:var(--mono);color:var(--dim);font-size:11px;margin-left:auto}
.cfg-add{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}
.cfg-grid{display:grid;grid-template-columns:auto 1fr;gap:8px 12px;align-items:center;margin-top:10px;max-width:640px}
.cfg-grid label{color:var(--dim);font-size:12px}
.cfg-switch{color:var(--dim);font-size:12px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.cfg-msg{font-family:var(--mono);font-size:11px}
.cfg-msg.ok{color:var(--green)} .cfg-msg.err{color:var(--red)}
.cfg-group{margin-top:8px} .cfg-group h4{margin:12px 0 6px;color:var(--amber);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.cfg-setrow{display:flex;align-items:center;gap:10px;padding:5px 0}
.cfg-setrow label{color:var(--tx);font-size:12px;min-width:180px}
.cfg-setrow input{max-width:120px}
.cfg-def{color:var(--dim);font-size:10px}
.cfg-warn{color:var(--amber);font-size:11px;margin:6px 0 10px}
/* aviso legal (plegable) */
.disclaimer{max-width:960px;margin:22px auto 44px;padding:8px 18px 12px;border-top:1px solid var(--border)}
.disc-head{color:var(--dim);font-size:11px;letter-spacing:.06em;cursor:pointer;user-select:none;padding:4px 0;display:inline-flex;align-items:center;gap:6px}
.disc-head:hover{color:var(--tx)}
.disc-caret{font-size:9px}
.disc-body{color:#5a636e;font-size:10.5px;line-height:1.6;text-align:justify;margin-top:6px}
.disclaimer.collapsed .disc-body{display:none}
.disc-body b{color:var(--dim)} .disc-body i{font-style:italic}

/* CONTACTO en el pie. Va ARRIBA del aviso legal y NO se pliega con él: el aviso se cierra y se
   olvida, pero el contacto tiene que seguir a la vista el día que algo falle. */
.contacto{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding-bottom:10px;margin-bottom:4px;
  border-bottom:1px solid var(--border);font-size:11.5px}
.ct-lbl{color:var(--dim)}
.ct-btn{display:inline-block;padding:3px 10px;background:var(--panel2);border:1px solid var(--border);
  border-radius:3px;color:var(--tx);text-decoration:none;font-size:11px;white-space:nowrap}
.ct-btn:hover{border-color:var(--amber);color:var(--amber)}
/* El aviso legal se pega a la derecha de esta misma fila: así no gasta un renglón entero para
   una línea que casi nadie abre. Sigue plegándose igual. */
.contacto .disc-head{margin-left:auto;padding:0}
button.ct-btn{cursor:pointer;font-family:var(--sans)}

/* POPUP de contacto. Antes esto era un mailto: que no hacía nada sin programa de correo
   configurado — el fallo que lo motivó. Ahora se escribe aquí y el servidor lo manda. */
.contactomodal{position:fixed;inset:0;background:rgba(0,0,0,.62);display:flex;align-items:center;
  justify-content:center;z-index:90;padding:20px}
.contactomodal[hidden]{display:none}
.ct-box{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:18px 20px;
  width:100%;max-width:520px;box-shadow:0 18px 50px rgba(0,0,0,.5)}
.ct-head{display:flex;align-items:center;justify-content:space-between;font-size:15px;font-weight:600;
  color:var(--tx);margin-bottom:14px}
.ct-x{color:var(--dim);cursor:pointer;font-size:14px;padding:2px 4px}
.ct-x:hover{color:var(--red)}
.ct-lab{display:block;color:var(--dim);font-size:11px;margin:10px 0 4px}
.ct-opt{color:#5a636e}
.ct-area,.ct-in{width:100%;background:var(--panel2);border:1px solid var(--border);color:var(--tx);
  border-radius:4px;padding:8px 9px;font-family:var(--sans);font-size:12.5px;outline:0}
.ct-area{resize:vertical;line-height:1.5}
.ct-area:focus,.ct-in:focus{border-color:var(--amber)}
.ct-tec{color:#5a636e;font-size:10.5px;margin-top:10px;line-height:1.5}
.ct-tec b{color:var(--dim)}
.ct-foot{display:flex;align-items:center;gap:8px;margin-top:14px}
.ct-res{flex:1;font-size:11.5px;color:var(--dim)}
.ct-res.ok{color:var(--green)} .ct-res.err{color:var(--red)}
.ct-cancel,.ct-send{padding:7px 14px;border-radius:4px;cursor:pointer;font-family:var(--sans);
  font-size:12px;font-weight:600;border:1px solid var(--border)}
.ct-cancel{background:none;color:var(--dim)}
.ct-cancel:hover{color:var(--tx)}
.ct-send{background:rgba(63,185,80,.15);color:var(--green);border-color:var(--green)}
.ct-send:hover{background:rgba(63,185,80,.28)}
.ct-send:disabled{opacity:.5;cursor:default}
/* Acuse de recibo con copia de lo enviado, en pantalla (no por correo: ver mostrarEnviadoConCopia). */
.ct-ok-msg{color:var(--tx);font-size:13px;line-height:1.5;margin:6px 0 4px}
.ct-copia{white-space:pre-wrap;background:var(--panel2);border:1px solid var(--border);border-radius:5px;
  padding:10px 11px;font-size:12px;line-height:1.5;color:var(--dim);max-height:220px;overflow:auto}

/* ACIERTO — lo que dijimos vs lo que se pagó (dentro de Seguimiento, tras una raya separadora) */
.acierto-box{margin-top:34px;padding-top:6px;border-top:1px solid var(--border)}
.ac-cab{margin:14px 0 4px}
.ac-titulo{margin:0 0 2px;font-size:15px}
.ac-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:14px 0}
.ac-card{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:14px}
.ac-card.ac-real{border-color:var(--amber)}
.ac-num{font-size:24px;font-weight:700;color:var(--tx);font-family:var(--mono)}
.ac-card.ac-real .ac-num{color:var(--amber)}
.ac-lab{color:var(--dim);font-size:11px;margin-top:4px;line-height:1.3}
.ac-h{margin:20px 0 8px;font-size:14px;color:var(--tx)}
.ac-h .desc{font-weight:400}
.ac-vacio{background:var(--panel);border:1px solid var(--border);border-left:2px solid var(--amber);
  border-radius:5px;padding:14px 16px;margin:14px 0;color:var(--dim);font-size:13px;line-height:1.6}
.ac-vacio b{color:var(--tx)}
.ac-metodo{margin-top:22px;padding:11px 13px;background:var(--panel);border:1px solid var(--border);
  border-radius:5px;color:#6e7681;font-size:11px;line-height:1.6}
.ac-metodo b{color:var(--dim)}
/* Barra "voy aprendiendo": cuántos cierres reales llevamos medidos (aciertos Y fallos). */
.ac-aprende{margin:20px 0 40px;padding:14px 16px;background:var(--panel);border:1px solid var(--border);border-radius:6px}
.ac-aprende-top{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--tx);margin-bottom:8px}
.ac-aprende-top span{color:var(--dim);font-family:var(--mono);font-size:12px}
.ac-bar{height:9px;background:var(--panel2);border-radius:5px;overflow:hidden}
.ac-bar-fill{height:100%;background:linear-gradient(90deg,var(--amber),var(--green));border-radius:5px;transition:width .4s}
.ac-aprende-pie{color:var(--dim);font-size:11px;margin-top:8px;line-height:1.5}
/* Desplegable "Conclusiones hasta ahora": lo que aprendí + si lo aplico */
.ac-concl{margin-top:12px;border-top:1px solid var(--border);padding-top:10px}
.ac-concl>summary{cursor:pointer;list-style:none;color:var(--tx);font-size:12.5px;font-weight:600;display:flex;align-items:center;gap:7px;user-select:none}
.ac-concl>summary::-webkit-details-marker{display:none}
.ac-concl>summary b{color:var(--amber);font-family:var(--mono);font-size:11px;background:var(--panel2);border-radius:9px;padding:1px 7px}
.ac-concl-car{margin-left:auto;color:var(--dim);transition:transform .2s}
.ac-concl[open] .ac-concl-car{transform:rotate(180deg)}
.ac-concl-body{margin-top:10px}
.ac-concl-scope{background:var(--panel2);border:1px solid var(--border);border-left:2px solid var(--amber);border-radius:5px;padding:9px 12px;color:var(--dim);font-size:11.5px;line-height:1.5;margin-bottom:12px}
.ac-concl-scope b{color:var(--tx)}
.ac-concl-it{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--border)}
.ac-concl-col{flex:1}
.ac-concl-tx{color:var(--tx);font-size:12.5px;line-height:1.45}
.ac-concl-dt{color:var(--dim);font-size:11px;line-height:1.4;margin-top:3px}
.ac-concl-ej{color:var(--tx);opacity:.75;font-size:11px;line-height:1.4;margin-top:4px;padding-left:9px;border-left:2px solid var(--border)}
.ac-badge{flex:none;font-size:10.5px;font-weight:600;border-radius:5px;padding:2px 7px;white-space:nowrap;line-height:1.5;border:1px solid}
.ac-badge.apl{color:var(--green);border-color:var(--green);background:rgba(63,185,80,.10)}
.ac-badge.obs{color:var(--amber);border-color:var(--amber);background:rgba(210,153,34,.10)}
.ac-badge.nota{color:var(--dim);border-color:var(--border);background:var(--panel2)}
.ac-concl-pie{color:var(--dim);font-size:11px;line-height:1.5;margin-top:10px}
.ac-concl-pie b{color:var(--tx)}
.ac-concl-vacio{margin-top:12px;border-top:1px solid var(--border);padding-top:10px;color:var(--dim);font-size:11.5px}

/* "¿Se revende?" en la ficha */
.drw-vendi{margin-top:14px;padding:11px 12px;background:var(--panel2);border:1px solid var(--border);border-radius:6px}
.dv-top{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--tx)}
.dv-nota{font-family:var(--mono);font-weight:700;font-size:13px}
.dv-motivos{color:var(--dim);font-size:11px;margin-top:6px;line-height:1.5}
.dv-nb{margin-top:9px}
.dv-nb-btn{display:inline-block;padding:5px 10px;background:rgba(210,153,34,.14);border:1px solid rgba(210,153,34,.4);
  border-radius:4px;color:var(--amber);text-decoration:none;font-size:11.5px;font-weight:600}
.dv-nb-btn:hover{background:rgba(210,153,34,.26)}
.dv-aviso{display:block;color:#6e7681;font-size:10px;line-height:1.5;margin-top:8px}

/* cerebro IA: observaciones, sello, botón recalcular */
.aibadge{font-size:10px;background:#1c2a3a;color:var(--blue);border:1px solid #24608a;border-radius:10px;padding:1px 7px;margin-left:6px;vertical-align:middle;letter-spacing:.04em}
.recalcbtn{margin-left:10px;background:#1a1430;color:#b794f6;border:1px solid #3b2d63;padding:4px 10px;border-radius:4px;font-family:var(--mono);font-size:11px;cursor:pointer;vertical-align:middle}
.recalcbtn:hover{background:#241a45} .recalcbtn:disabled{opacity:.5;cursor:default}
.obs{margin-top:12px;padding:11px 13px;background:var(--panel2);border-left:3px solid var(--blue);border-radius:4px;color:var(--tx);font-size:12.5px;line-height:1.6}
.obs b{color:var(--blue)}
.drw-verdict{margin-top:12px;padding:9px 11px;background:var(--panel2);border-radius:4px;color:var(--amber);font-size:12px;line-height:1.5}
.drw-verdict b{color:var(--dim)}

/* Copias: panel de progreso de resurrección (mirror de #runpanel) */
#respanel{bottom:70px}

/* Sub-pestañas (Nicho: por tipo de jugada) */
.subtabs{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 12px}
.subtab{padding:5px 12px;border:1px solid var(--border);border-radius:14px;color:var(--dim);cursor:pointer;font-size:12px;user-select:none;transition:background .12s,color .12s}
.subtab:hover{color:var(--tx);border-color:var(--dim)}
.subtab.on{background:var(--panel2);color:var(--amber);border-color:var(--amber)}
.subtab b{color:inherit;font-weight:700;margin-left:2px}

/* Panel de curación (Melón 2: elegir URLs buenas) */
.curatemodal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:50}
.curatemodal.hidden{display:none}
.cm-box{background:var(--panel);border:1px solid var(--border);border-radius:8px;width:min(760px,92vw);max-height:82vh;display:flex;flex-direction:column}
.cm-head{padding:10px 14px;border-bottom:1px solid var(--border);color:var(--amber)}
.cm-body{padding:10px 14px;overflow:auto}
.cm-list{max-height:52vh;overflow:auto;font-size:12px;border:1px solid var(--border);border-radius:6px;padding:4px 8px}
/* columnas fijas → todo alineado a la misma altura (checkbox · capturas · salud · palabras · url · 👁 · fecha) */
.cm-row{display:grid;grid-template-columns:min-content 52px 20px 52px 1fr min-content 54px;gap:8px;align-items:center;padding:3px 0;border-bottom:1px solid var(--panel2)}
.cm-cap{color:var(--amber);text-align:right;white-space:nowrap}
.cm-hb-slot{text-align:center}
.cm-words{color:var(--dim);font-size:11px;text-align:right;white-space:nowrap}
.cm-u{color:var(--tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.cm-eye{justify-self:center}
.cm-last{color:var(--dim);text-align:right;font-size:11px;white-space:nowrap}
.cm-foot{margin-top:10px;display:flex;justify-content:space-between;align-items:center}
.cm-sub{color:var(--dim);font-size:12px;margin-bottom:6px}
/* lector propio: ancho legible + tipografía humana + galería de imágenes archivadas */
.rd-doc{max-width:680px;margin:0 auto}
.rd-h{margin:16px 0 4px;font-size:15px;font-weight:600;color:var(--tx);line-height:1.35}
.rd-p{margin:0 0 11px;color:var(--tx);line-height:1.65;font-size:14px}
.rd-imgs{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.rd-imgs img{max-width:170px;max-height:120px;border-radius:6px;object-fit:cover;background:var(--panel2)}
.rd-sep{margin:22px 0 8px;color:var(--dim);font-size:11px;text-align:center;letter-spacing:1px;border-top:1px dashed var(--border);padding-top:12px}
.rd-tail{opacity:.45;transition:opacity .15s}
.rd-tail.rd-included{opacity:1}
.rd-addbtn{margin-left:8px;padding:1px 8px;font-size:11px}
.rd-tail .rd-h{font-size:13px;margin:8px 0 2px}
.rd-tail .rd-p{font-size:12px;margin:0 0 5px}
.cm-traf{color:var(--green);font-size:11px}

/* ── Panel del estudio: lo que decide la compra, arriba ── */
.estudiobox{position:fixed;right:16px;top:96px;bottom:16px;width:min(560px,92vw);overflow-y:auto;overflow-x:hidden;
  background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:14px;z-index:60;
  box-shadow:0 8px 32px rgba(0,0,0,.55)}
.estudio-cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.estudio-cab h3{margin:0;font-size:15px}
.estudiobox .x{background:none;border:0;color:var(--dim);cursor:pointer;font-size:16px;line-height:1}
.estudiobox .dim{color:var(--dim);font-size:12px;line-height:1.5}
/* El titular: verde si hay que pujar, rojo si la conclusión es no comprar. */
.techo{background:rgba(16,185,129,.12);border:1px solid var(--green);border-radius:6px;padding:12px;text-align:center;margin-bottom:12px}
.techo-no{background:rgba(239,68,68,.12);border-color:var(--red)}
.techo-n{font-family:var(--mono);font-size:24px;font-weight:700;color:var(--green)}
.techo-no .techo-n{color:var(--red)}
.techo-s{font-size:12px;color:var(--dim);margin-top:4px}
.estudiobox .sec{margin:12px 0}
.estudiobox .sec h4{margin:0 0 6px;font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px}
.estudiobox .sec ul{margin:0;padding-left:18px;font-size:12px;line-height:1.6}
.estudiobox .sec p{margin:0;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.estudiobox .g-alta{color:var(--red)} .estudiobox .g-media{color:var(--amber)}

.abog{background:rgba(239,68,68,.08);border-left:3px solid var(--red);padding:8px 10px;border-radius:4px}
.estudiobox .acciones{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap;align-items:center}
.disclaimer{margin-top:12px;padding-top:10px;border-top:1px solid var(--border);font-size:10px;color:var(--dim);line-height:1.4}

/* Compartir y cerrar, al pie del panel: no hay que subir a buscar la ✕ de arriba. */
.compartir{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}
.compartir .dim{font-size:11px;color:var(--dim);margin-right:2px}
.cbtn{font-size:11px;padding:4px 9px;border-radius:4px;border:1px solid var(--border);background:var(--panel2);
  color:var(--tx);cursor:pointer;text-decoration:none;font-family:var(--sans);line-height:1.6}
.cbtn:hover{border-color:var(--blue);color:var(--blue);text-decoration:none}
/* Rojo de entrada, no solo al pasar el ratón: en gris apagado casi no se veía. */
.cerrar-abajo{display:block;width:100%;margin-top:12px;padding:10px;border-radius:5px;
  border:1px solid var(--red);background:rgba(248,81,73,.12);color:var(--red);cursor:pointer;
  font-size:12.5px;font-weight:600}
.cerrar-abajo:hover{background:rgba(248,81,73,.22)}
.copiabox{margin-top:8px}
.copiabox p{margin:0 0 5px;font-size:11px}
.copiabox textarea{width:100%;background:var(--bg);color:var(--tx);border:1px solid var(--blue);
  border-radius:4px;padding:7px;font-family:var(--mono);font-size:10px;resize:vertical}
/* La razón de cada jugada se lee entera: parte en varias líneas en vez de cortarse. */
/* Descartadas: si la conclusión es no comprar, sus números no deben competir con la recomendación. */
.tope{color:var(--amber);cursor:help;margin-left:2px}
.nota-desc{margin:4px 0 6px;font-size:10.5px;color:var(--dim);line-height:1.45}
.nota-desc em{color:var(--tx);font-style:italic}

/* ── Jugadas como tarjetas ── */
/* Antes eran filas de una tabla de 3 columnas y la razón (que lleva la cuenta: "39.4k visitas con
   RPM $5 = ~$197 menos hosting") quedaba en una columna estrecha, ilegible. */
.jug{border:1px solid var(--border);border-radius:6px;padding:9px 11px;margin-bottom:7px;background:var(--panel)}
.jug-cab{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.jug-nom{font-size:12.5px;font-weight:600;color:var(--tx)}
.jug-num{font-family:var(--mono);font-size:15px;font-weight:700;color:var(--green);white-space:nowrap}
.jug-razon{margin:6px 0 0;font-size:11.5px;line-height:1.55;color:var(--dim)}
.jug-esf{display:inline-block;margin-top:6px;font-size:9.5px;text-transform:uppercase;letter-spacing:.4px;
  color:var(--dim);border:1px solid var(--border);border-radius:10px;padding:1px 7px}
/* La recomendada: destacada de verdad. */
.jug-rec{border-color:var(--green);background:rgba(63,185,80,.07);border-width:1px}
.jug-rec .jug-nom{color:var(--green);font-size:13.5px}
.jug-rec .jug-num{font-size:19px}
/* Si la conclusión es NO comprar, en rojo y sin cifra: no hay techo que enseñar. */
.jug-no.jug-rec{border-color:var(--red);background:rgba(248,81,73,.08)}
.jug-no.jug-rec .jug-nom{color:var(--red)}
.jug-no .jug-num{color:var(--dim)}
/* Descartadas: apagadas pero LEGIBLES — explican por qué no sale a cuenta. */
.jug-desc{opacity:.8;background:transparent}
.jug-desc .jug-num{color:var(--dim);font-weight:600}
/* Las otras opciones, plegadas: el detalle está si lo quieres, no de entrada. */
.otras{margin-top:8px}
.otras summary{cursor:pointer;font-size:11px;color:var(--blue);padding:5px 0;list-style:revert}
.otras summary:hover{text-decoration:underline}
.otras[open] summary{margin-bottom:6px}

/* AS, TF, Backlinks y Ref son columnas propias (así se pueden ordenar). El 2º de cada pareja
   —TF y Ref— va algo más tenue, para que la vista siga leyéndolos como pareja. */
.v1,.v2{font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.v1{color:var(--tx);font-weight:600}
.v2{color:var(--dim);font-weight:500}

/* Flecha de orden: apagada (↕) en las columnas ordenables, encendida en la que manda.
   Sin esto no hay forma de saber por qué columna está ordenada la tabla ni en qué sentido. */
.ord{margin-left:5px;font-size:8px;color:#3d444d;vertical-align:middle}
thead th:hover .ord{color:var(--dim)}
.ord.on{color:var(--amber)}
thead th.sorted{color:var(--amber)}

/* El botón de lanzar se convierte en Cancelar mientras corre: en rojo para que no haya dudas. */
.runbtn.cancelar{background:rgba(248,81,73,.15);color:var(--red);border-color:var(--red)}
.runbtn.cancelar:hover{background:rgba(248,81,73,.28)}

/* Vista Por proveedor: subpestañas de plataforma. */
.provtabs{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.provtab{background:#161b22;border:1px solid #30363d;border-radius:6px;color:var(--tx);padding:5px 11px;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.provtab:hover{border-color:var(--amber)}
.provtab.on{border-color:var(--amber);color:var(--amber);background:rgba(210,153,34,.10)}
.provn{background:#21262d;border-radius:10px;padding:0 7px;font-size:11px;color:var(--dim)}
.provtab.on .provn{color:var(--amber)}
.provtab.vacio{opacity:.45}
.provtab.vacio:hover{opacity:.7;border-color:#30363d}
.provtab.vacio.on{opacity:1;border-color:var(--amber)}
.provvacio{color:var(--dim);font-size:13px;padding:22px 14px;border:1px dashed #30363d;border-radius:8px;text-align:center}

/* WPL: enlace desde Wikipedia = señal dura. Se resalta en verde cuando lo hay. */
.wpl-hit{color:var(--green);cursor:help;white-space:nowrap}

/* Caja "de dónde salen los dominios" (el ancho). */
.funnelbox{margin-top:16px;border:1px solid #30363d;border-radius:8px;padding:11px 13px;background:#0f1319}
.funnelbox>b{color:var(--amber)}
.funnelbox .desc{display:block;margin:3px 0 8px}
table.funnel{width:auto;max-width:100%;font-size:12px}
table.funnel th{color:var(--dim);font-weight:600;text-align:left;padding:3px 14px 3px 0;border-bottom:1px solid #21262d}
table.funnel td{padding:3px 14px 3px 0;white-space:nowrap}
table.funnel td.num{text-align:right;font-variant-numeric:tabular-nums}
table.funnel td.desc{color:var(--dim);font-size:11px;white-space:normal;min-width:120px}
table.funnel tfoot td{border-top:1px solid #21262d;padding-top:5px}

/* 🔎 Auditar: caja de búsqueda + tarjeta de resultado de un dominio suelto. */
.audit-box{display:flex;gap:8px;align-items:center;justify-content:center;margin:16px 0}
.audit-box .note-in{max-width:420px}
.audit-card{border:1px solid var(--border,#2a2a2a);border-radius:10px;padding:18px 22px;margin:10px auto 0;max-width:980px}
.audit-card.wide{width:100%}
.audit-head{font-size:19px;margin-bottom:4px}
.audit-verd{margin:4px 0 8px;color:var(--tx,#ddd);font-size:14px}
.audit-spam{color:var(--red);margin:0 0 8px;font-size:13px}
.ad{color:var(--dim);font-size:12px}
/* Gráfico "vida en Wayback": barras por año */
.wb-chart{margin:14px 0 16px;border-top:1px solid #12171d;padding-top:12px}
.wb-lbl{font-size:12px;color:var(--tx);margin-bottom:8px}
.wb-bars{display:flex;align-items:flex-end;gap:5px;height:74px}
.wb-bar{flex:1;background:linear-gradient(180deg,var(--green,#3fb950),#2a7d38);border-radius:3px 3px 0 0;min-height:4px;transition:opacity .15s}
.wb-bar:hover{opacity:.7}
.wb-years{display:flex;gap:5px;font-size:10px;color:var(--dim);margin-top:4px}
.wb-years span{flex:1;text-align:center}
/* Barra medidor (% recuperable) */
.mtr{display:inline-block;vertical-align:middle;width:90px;height:8px;background:#161b22;border-radius:4px;overflow:hidden;margin-right:6px}
.mtr-fill{display:block;height:100%;background:var(--green,#3fb950)}
/* Datos en 2 columnas */
.ad-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 44px}
.ad-row{display:flex;justify-content:space-between;gap:14px;align-items:baseline;padding:7px 0;border-bottom:1px solid #12171d;font-size:13px}
.ad-k{color:var(--dim);white-space:nowrap}
.ad-v{text-align:right}
.audit-actions{margin-top:16px;display:flex;gap:10px;align-items:center}
@media(max-width:760px){.ad-cols{grid-template-columns:1fr}}