/* =====================================================================
   ANALIZADOR DE ACTIVOS CON AI — Diseño "MERIDIANO"
   Azul medianoche con acento ámbar. Deliberadamente distinto del carbón
   plateado del Analizador de Opciones: son dos herramientas distintas y no
   deben confundirse de un vistazo.

   Reglas del tema:
   - Esquinas suavemente redondeadas (2px), frente a las rectas de opciones.
   - El ámbar es el acento de foco e interacción; nunca significa dirección.
   - Verde azulado = sube, coral = baja. Se leen como par pero no son el
     verde/rojo saturado del otro proyecto.
   - Los números siempre en monoespaciada: se comparan en columna.
   ===================================================================== */

:root{
  --bg:        #0b1017;   /* azul medianoche */
  --bg-soft:   #0f151e;
  --panel:     #131b26;   /* azul pizarra */
  --panel-2:   #18222f;
  --line:      #24303f;
  --line-hot:  #334256;
  --text:      #e6eaf0;
  --muted:     #94a3b8;
  --faint:     #64748b;
  --accent:    #e0a458;   /* ámbar: foco e interacción */
  --accent-soft: rgba(224,164,88,.09);
  --accent-2:  #b8834a;
  --call:      #3fbfa0;   /* verde azulado: sube / compra */
  --call-strong: #4fd8b6;
  --call-soft: rgba(63,191,160,.11);
  --put:       #e2686b;   /* coral: baja / corto */
  --put-strong: #f47f82;
  --put-soft:  rgba(226,104,107,.11);
  --wait:      #8b9cb3;   /* azul apagado: vigilar, sin carga direccional */
  --wait-strong: #a9b8cc;
  --wait-soft: rgba(139,156,179,.10);
  --danger:    #e2686b;
  --spark:     #7aa5d2;   /* azul acero para detalles */
  --spark-soft: rgba(122,165,210,.14);
  --font:      -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;
  --mono:      ui-monospace,"SF Mono",SFMono-Regular,Menlo,Consolas,monospace;
}

*{box-sizing:border-box;border-radius:2px}
button,input,select,textarea{border-radius:2px}
img,svg{border-radius:0}
html{scroll-behavior:smooth}
body.nx-body{
  margin:0;
  background:var(--bg);
  background-image:radial-gradient(900px 420px at 50% -160px, rgba(122,165,210,.07), transparent 70%);
  background-attachment:fixed;
  color:var(--text);
  font-family:var(--font);
  font-size:15px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.hidden{display:none!important}
a{color:var(--accent);text-decoration:none}
small{color:var(--muted)}
::selection{background:var(--accent);color:#101113}

/* ============================== TOPBAR ============================== */
.nx-topbar{
  position:sticky;top:0;z-index:60;
  background:rgba(16,17,19,.94);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-hot);
}
.nx-topbar-inner{
  max-width:1560px;margin:0 auto;padding:10px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.nx-identity{display:flex;align-items:center;gap:12px;min-width:0}
.nx-logo{
  width:40px;height:40px;overflow:hidden;flex:0 0 auto;
  border:1px solid var(--line-hot);
  display:grid;place-items:center;background:var(--panel-2);
}
.nx-logo img{width:100%;height:100%;object-fit:cover;display:block}
.nx-logo span{display:none;font-weight:700;color:var(--accent);font-size:15px;font-family:var(--mono)}
.nx-identity-copy{display:flex;flex-direction:column;min-width:0}
.nx-name{font-weight:700;letter-spacing:.8px;font-size:13.5px;white-space:nowrap}
.nx-role{color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-topbar-meta,.nx-footer-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nx-chip{
  display:inline-flex;align-items:center;
  border:1px solid var(--line-hot);
  background:var(--panel);color:var(--muted);
  font-size:11px;letter-spacing:.5px;font-weight:600;
  padding:5px 12px;font-family:var(--mono);
}
.nx-chip b{color:var(--text);font-weight:700}
.nx-version{color:#101113;background:var(--accent);border-color:var(--accent);font-weight:700}
.nx-version b{color:#101113}
.nx-health{color:var(--call)}
.nx-admin{color:var(--text);border-color:var(--line-hot);transition:.15s}
.nx-admin:hover{border-color:var(--accent);background:var(--accent-soft)}

/* ======================= SHELL: SIDEBAR + MAIN ====================== */
.nx-shell{
  max-width:1560px;margin:0 auto;padding:20px 22px 50px;
  display:grid;grid-template-columns:330px minmax(0,1fr);gap:20px;
  align-items:start;
}
.nx-right{min-width:0;display:grid;gap:16px;align-content:start}

/* ----------------------------- SIDEBAR ----------------------------- */
.nx-sidebar{
  position:sticky;top:76px;
  display:grid;gap:14px;
  max-height:calc(100vh - 96px);overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:var(--line-hot) transparent;
}
.nx-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-top:2px solid var(--accent);
  padding:16px;
}
.nx-card-h{
  margin:0 0 14px;font-size:12px;font-weight:700;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--text);font-family:var(--mono);
  padding-bottom:10px;border-bottom:1px solid var(--line);
}
.nx-label{
  display:block;font-size:11px;font-weight:600;letter-spacing:.6px;
  color:var(--muted);margin:12px 0 5px;text-transform:uppercase;
}
.nx-label:first-of-type{margin-top:0}
.nx-label small{color:var(--faint);font-weight:500;text-transform:none;letter-spacing:.2px}

textarea,input[type=number],input[type=text]{
  width:100%;background:var(--bg-soft);border:1px solid var(--line-hot);
  color:var(--text);
  font-family:var(--mono);font-size:14px;padding:9px 11px;outline:none;
  transition:border-color .15s;
}
textarea:focus,input:focus{border-color:var(--accent)}
textarea{resize:vertical;min-height:52px}

/* Presupuesto y tiempo */
.nx-money-input{position:relative;display:flex;align-items:center}
.nx-money-input span{position:absolute;left:11px;font-family:var(--mono);color:var(--accent);font-weight:700;font-size:15px}
.nx-money-input input{padding-left:25px;font-size:17px;font-weight:700}
.nx-dte-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.nx-dte-fields input{font-weight:700;text-align:center}
.nx-preset{
  width:auto;margin-top:10px;
  border:1px dashed var(--line-hot);background:transparent;color:var(--muted);
  font-family:var(--mono);font-size:11px;font-weight:600;
  padding:8px 10px;cursor:pointer;transition:.15s;
}
.nx-preset:hover{border-color:var(--accent);color:var(--accent)}

/* Guía DTE: zonas coloreadas por calidad, igual que la barra de horas */
.dte-guide{margin-top:14px}
.dte-track-wrap{padding-top:24px}
.dte-track{position:relative;height:14px;display:flex;background:var(--bg-soft);border:1px solid var(--line-hot);box-shadow:0 0 12px rgba(0,0,0,.45) inset}
.dte-zone{height:100%;opacity:1}
.dte-zone.ultra{flex-grow:7;background:var(--put-strong)}          /* 1–7 días: theta brutal */
.dte-zone.short{flex-grow:13;background:var(--wait-strong)}        /* 8–20 días: apurado */
.dte-zone.starter{flex-grow:25;background:var(--call-strong)}      /* 21–45: balanceado */
.dte-zone.medium{flex-grow:45;background:#2c9b76}           /* 46–90: aceptable */
.dte-zone.long{flex-grow:90;background:var(--wait-strong)}         /* 91+: prima cara */
.dte-selected-range{
  position:absolute;top:-3px;height:18px;
  background:transparent;border-left:2px solid var(--text);border-right:2px solid var(--text);
  box-shadow:inset 0 0 0 9999px rgba(232,233,234,.18);
}
.dte-zone-labels{display:flex;margin-top:5px}
.dte-zone-labels span{
  font-family:var(--mono);font-size:8.5px;letter-spacing:.3px;color:var(--faint);
  text-align:center;overflow:hidden;white-space:nowrap;
}
.dte-zone-labels span.good{color:var(--call);font-weight:700}
.dte-zone-labels span.bad{color:var(--put)}
.dte-legend{display:flex;gap:12px;flex-wrap:wrap;margin-top:7px;font-size:10px;color:var(--faint);font-family:var(--mono)}
.dte-legend i{display:inline-block;width:8px;height:8px;margin-right:5px;vertical-align:middle}
.dte-legend .good i{background:var(--call-strong)}
.dte-legend .mid i{background:var(--wait-strong)}
.dte-legend .bad i{background:var(--put-strong)}
.dte-marker{
  position:absolute;top:-24px;transform:translateX(-50%);
  background:var(--panel-2);border:1px solid var(--line-hot);
  padding:0 6px;font-family:var(--mono);font-size:10.5px;color:var(--text);
  white-space:nowrap;z-index:2;line-height:1.7;
}
.dte-marker.min{border-bottom:2px solid var(--accent)}
.dte-marker.max{border-bottom:2px solid var(--accent-2)}
.dte-sliders{margin-top:12px;display:grid;gap:6px}
.dte-slider-row{display:grid;grid-template-columns:110px 1fr;gap:10px;align-items:center}
.dte-slider-label{display:flex;justify-content:space-between;gap:6px;font-family:var(--mono);font-size:9.5px;letter-spacing:1px;color:var(--faint)}
.dte-slider-label strong{color:var(--text);font-size:10.5px}
input[type=range].dte-range-slider{
  -webkit-appearance:none;appearance:none;width:100%;height:3px;background:var(--line-hot);outline:none;
}
input[type=range].dte-range-slider::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:12px;height:16px;
  background:var(--accent);cursor:pointer;border:1px solid var(--bg);
}
input[type=range].dte-range-slider.max::-webkit-slider-thumb{background:var(--accent-2)}
input[type=range].dte-range-slider::-moz-range-thumb{width:12px;height:16px;background:var(--accent);border:1px solid var(--bg);cursor:pointer}
.dte-scale{display:none}
.dte-advice{margin-top:10px;font-size:12px;color:var(--muted)}
.dte-advice:empty{display:none}

/* Dirección */
.direction-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}
.direction-choice{
  position:relative;cursor:pointer;border:1px solid var(--line-hot);
  background:var(--bg-soft);padding:9px 6px;text-align:center;
  transition:.15s;user-select:none;
}
.direction-choice input{position:absolute;opacity:0;pointer-events:none}
.direction-choice span{font-weight:700;font-size:11.5px;letter-spacing:1px;font-family:var(--mono);color:var(--muted)}
.direction-choice small{display:none}
.direction-choice:hover{border-color:var(--accent)}
.direction-choice.auto.active{border-color:var(--accent);background:var(--accent-soft)}
.direction-choice.auto.active span{color:var(--accent)}
.direction-choice.call.active{border-color:var(--call);background:var(--call-soft)}
.direction-choice.call.active span{color:var(--call)}
.direction-choice.put.active{border-color:var(--put);background:var(--put-soft)}
.direction-choice.put.active span{color:var(--put)}
.nx-direction-note{margin-top:10px;font-size:12px;color:var(--muted);border-left:2px solid var(--line-hot);padding:4px 10px}

/* Filtros del contrato (siempre visibles) */
.nx-filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.nx-field small{display:block;margin-top:4px;font-size:10.5px;color:var(--faint)}

/* Botones */
.analysis-actions{display:flex;gap:10px;flex-wrap:wrap}
.analysis-actions button{
  position:relative;overflow:hidden;
  border:none;cursor:pointer;width:auto;min-width:150px;flex:1;
  text-align:left;padding:12px 16px;transition:.18s;
}
.analysis-actions .btn-main{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-family:var(--font);font-weight:800;font-size:13.5px;letter-spacing:.3px;
}
.analysis-actions .btn-main i{font-style:normal;font-family:var(--mono);transition:transform .2s}
.analysis-actions .btn-sub{display:block;margin-top:2px;font-size:10.5px;opacity:.75}
#scanButton{background:var(--accent);color:#101113}
#scanButton:hover{background:#fff}
#scanButton:hover .btn-main i{transform:translateX(4px)}
#scanButton::after{
  content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.35),transparent);
  transition:left .5s;
}
#scanButton:hover::after{left:120%}
#sweepButton{background:transparent;color:var(--text);border:1px solid var(--line-hot)}
#sweepButton:hover{border-color:var(--accent)}
#sweepButton:hover .btn-main i{transform:rotate(90deg)}
#sweepButton .btn-sub{color:var(--faint)}
.analysis-actions button:disabled{opacity:.45;cursor:wait}

.nx-rule{margin:0;color:var(--faint);font-size:11.5px;line-height:1.5}
.nx-rule strong{color:var(--wait)}

/* --------------------------- CONTENIDO ----------------------------- */
.nx-content{min-width:0;display:grid;gap:16px;align-content:start;justify-items:stretch}
.nx-content-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;
  border-bottom:1px solid var(--line);padding-bottom:14px;
}
.nx-content-head h1{margin:0;font-size:21px;font-weight:700;letter-spacing:-.2px}
.nx-content-head p{margin:4px 0 0;color:var(--muted);font-size:13px}

.summary{
  background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);
  padding:12px 18px;color:var(--muted);font-size:13.5px;
}
.summary strong{color:var(--text)}
.loading{
  display:flex;align-items:center;gap:14px;color:var(--muted);
  background:var(--panel);border:1px solid var(--line);
  padding:16px 20px;font-size:13.5px;
}
.spinner{
  width:18px;height:18px;flex:0 0 auto;
  border:2px solid var(--line-hot);border-top-color:var(--accent);
  animation:nx-spin .7s linear infinite;
}
@keyframes nx-spin{to{transform:rotate(360deg)}}
.error-box{
  background:var(--put-soft);border:1px solid var(--line);border-left:3px solid var(--put);
  color:var(--muted);padding:11px 16px;margin:0 0 8px;font-size:13px;
}
.error-box strong{color:var(--put)}
.empty{text-align:center;color:var(--muted);padding:40px 20px;border:1px dashed var(--line-hot)}

/* Franja de índices: el sparkline pasa a ser el fondo de la tarjeta.
   Antes vivía en una cajita de 46px en una esquina, que ni se leía ni
   equilibraba la tarjeta. Ahora ocupa todo el ancho por detrás de las cifras,
   que es donde una línea de tendencia informa de verdad. */
.nx-indices{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:8px;
}
.nx-index{
  position:relative;overflow:hidden;min-width:0;
  border:1px solid var(--line);border-left:2px solid var(--spark);
  background:var(--panel);padding:10px 12px 12px;font-family:var(--mono);
  transition:border-color .15s;
}
.nx-index:hover{border-color:var(--line-hot)}
.nx-index.up{border-left-color:var(--call)}
.nx-index.down{border-left-color:var(--put)}

/* Contenido por encima del sparkline de fondo. */
.nx-index-top,.nx-index-val,.nx-index-bottom{position:relative;z-index:1}
.nx-index-top span{
  display:block;font-size:9.5px;letter-spacing:1.1px;color:var(--faint);font-weight:700;
  text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.nx-index-val{
  font-size:19px;font-weight:700;color:var(--text);white-space:nowrap;
  line-height:1.2;margin-top:3px;letter-spacing:-.4px;
}
.nx-index-bottom{display:flex;align-items:center;gap:6px;margin-top:2px}
.nx-index-chg{font-size:11.5px;font-weight:700;white-space:nowrap}
.nx-index-chg.positive{color:var(--call)}
.nx-index-chg.negative{color:var(--put)}
.nx-index-chg.neutral{color:var(--muted)}
.nx-index-chg::before{margin-right:3px;font-size:9px}
.nx-index-chg.positive::before{content:"\25B2"}
.nx-index-chg.negative::before{content:"\25BC"}
.nx-index-bottom small{font-size:9.5px;color:var(--faint);letter-spacing:.5px}

/* El sparkline: ocupa la mitad inferior de la tarjeta, detrás del texto. */
.nx-index-spark{
  position:absolute;left:0;right:0;bottom:0;height:52%;
  display:block;pointer-events:none;opacity:.5;
}
.nx-index-spark svg{width:100%;height:100%;display:block}
.nx-indices-loading{font-size:11px;color:var(--faint);font-family:var(--mono)}

/* Presets de presupuesto */
.money-presets{display:flex;gap:6px;margin-top:8px}
.money-preset{
  flex:1;border:1px solid var(--line-hot);background:var(--bg-soft);color:var(--muted);
  font-family:var(--mono);font-size:12px;font-weight:700;padding:7px 0;cursor:pointer;transition:.15s;
}
.money-preset:hover{border-color:var(--accent);color:var(--text)}
.money-preset.active{background:var(--accent);border-color:var(--accent);color:#101113}

/* Mejor hora para escanear */
.nx-hours-best{margin:2px 0 0;font-size:12.5px;color:var(--muted)}
.nx-hours-best strong{color:var(--call);font-family:var(--mono)}
.hours-labels{display:flex;margin-top:4px}
.hours-labels span{font-family:var(--mono);font-size:9px;letter-spacing:.4px;color:var(--faint);text-align:center;overflow:hidden;white-space:nowrap}
.hours-labels span.good{color:var(--call);font-weight:700}
.nx-hours-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.nx-hours-now{font-family:var(--mono);font-size:12px;font-weight:700}
.nx-hours-now.good{color:var(--call)}
.nx-hours-now.mid{color:var(--wait)}
.nx-hours-now.bad{color:var(--put)}
.hours-bar{position:relative;display:flex;height:16px;margin:18px 0 6px;border:1px solid var(--line-hot);box-shadow:0 0 14px rgba(0,0,0,.45) inset}
.hours-seg{height:100%;opacity:1}
.hours-seg.good{background:var(--call-strong)}
.hours-seg.mid{background:var(--wait-strong)}
.hours-seg.bad{background:var(--put-strong)}
.hours-arrow{
  position:absolute;top:-12px;transform:translateX(-50%);z-index:2;
  width:0;height:0;border:8px solid transparent;border-top-color:#fff;border-bottom:none;
  filter:drop-shadow(0 0 5px rgba(255,255,255,.85));
}
.hours-scale{display:flex;justify-content:space-between;font-family:var(--mono);font-size:9.5px;color:var(--faint)}
.hours-legend{display:flex;gap:14px;margin-top:8px;flex-wrap:wrap;font-size:10.5px;color:var(--faint)}
.hours-legend i{display:inline-block;width:9px;height:9px;margin-right:5px;vertical-align:middle}
.hours-legend .good i{background:var(--call-strong)}
.hours-legend .mid i{background:var(--wait-strong)}
.hours-legend .bad i{background:var(--put-strong)}
.nx-hours-advice{margin:10px 0 0;font-size:12.5px;color:var(--muted);line-height:1.55}

/* Barras dentro de scores compactos */
.thumb-score .meter{height:4px;margin-top:7px}
.thumb-score .meter-fill{border-right-width:2px}
.option-score .score-gauge{min-width:120px;max-width:170px;margin:10px auto 0}
.preferred-detail .meter{max-width:260px;margin-top:8px}

/* ------------------------ TARJETAS RESULTADO ------------------------ */
/* Jerarquía deliberada, de arriba abajo:
   1. el ticker y el precio  — qué activo es
   2. una barra fina         — cómo de buena es la oportunidad
   3. un bloque de datos     — qué harías exactamente y qué arriesgas
   El score dejó de ser un número gigante compitiendo con el ticker: como cifra
   suelta no dice nada, y como barra se compara entre tarjetas de un vistazo. */

.thumb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(266px,1fr));gap:12px}
.thumb-card{
  position:relative;cursor:pointer;
  background:var(--panel);border:1px solid var(--line);
  padding:0;transition:border-color .15s,transform .15s;
  display:flex;flex-direction:column;overflow:hidden;
}
.thumb-card:hover{border-color:var(--accent);transform:translateY(-1px)}
.thumb-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* La franja de color va arriba y es lo único que codifica dirección. */
.thumb-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--wait);
}
.thumb-card.call::before{background:var(--call)}
.thumb-card.put::before{background:var(--put)}
.thumb-card.opportunity{border-color:var(--accent)}

/* Cabecera: rango y etiqueta de preferida en la misma línea, sin tapar nada. */
.thumb-rank{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 14px 0;font-family:var(--mono);
}
.thumb-rank b{font-size:11px;font-weight:700;color:var(--faint);letter-spacing:.5px}
.preferred-pill{
  font-size:9px;font-weight:800;letter-spacing:1.1px;
  color:var(--bg);background:var(--accent);padding:2px 7px;white-space:nowrap;
}
.thumb-card.wait .preferred-pill{background:var(--wait)}

/* Identidad del activo. */
.thumb-top{
  display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  padding:2px 14px 0;
}
.thumb-symbol{font-family:var(--mono);font-weight:800;font-size:21px;letter-spacing:.3px;line-height:1.25}
.thumb-price{font-size:14px;color:var(--text);font-family:var(--mono);font-weight:600;white-space:nowrap}
.thumb-bias{
  padding:1px 14px 0;font-size:10.5px;color:var(--faint);
  letter-spacing:.3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* Calidad: barra fina + cifra pequeña. Se compara entre tarjetas, no grita. */
.thumb-quality{padding:10px 14px 0}
.thumb-quality-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:var(--faint);
  font-weight:700;margin-bottom:5px;
}
.thumb-quality-head b{font-family:var(--mono);font-size:12.5px;color:var(--text);letter-spacing:0}
.thumb-quality-bar{height:3px;background:var(--bg-soft);border:1px solid var(--line);overflow:hidden}
.thumb-quality-bar i{display:block;height:100%;background:var(--accent)}
.thumb-card.call .thumb-quality-bar i{background:var(--call)}
.thumb-card.put .thumb-quality-bar i{background:var(--put)}

/* Bloque del plan: etiquetas a la izquierda, cifras alineadas a la derecha.
   Alinear la columna numérica es lo que permite comparar dos tarjetas sin leer. */
.thumb-plan{
  margin:12px 0 0;padding:10px 14px 12px;
  border-top:1px solid var(--line);background:var(--bg-soft);
  display:grid;gap:4px;
}
.thumb-plan-action{
  display:flex;align-items:baseline;gap:7px;margin-bottom:4px;
}
.thumb-plan-action span{
  font-family:var(--mono);font-size:9.5px;font-weight:800;letter-spacing:1px;
  padding:2px 6px;border:1px solid currentColor;
}
.thumb-card.call .thumb-plan-action span{color:var(--call)}
.thumb-card.put .thumb-plan-action span{color:var(--put)}
.thumb-card.wait .thumb-plan-action span{color:var(--wait)}
.thumb-plan-action small{font-size:11px;color:var(--muted);font-family:var(--mono)}
.thumb-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  font-size:11.5px;
}
.thumb-row span{color:var(--faint)}
.thumb-row b{font-family:var(--mono);font-size:12.5px;font-weight:600;color:var(--text);white-space:nowrap}
.thumb-row b.positive{color:var(--call)}
.thumb-row b.negative{color:var(--put)}
.thumb-note{
  padding:9px 14px 0;font-size:11px;color:var(--muted);line-height:1.5;
}
.thumb-note.unaffordable{color:var(--put)}

/* Pie con el estado de la AI: siempre abajo, altura fija aunque esté vacío. */
.thumb-ai{
  margin-top:auto;display:flex;align-items:center;gap:8px;
  padding:9px 14px;border-top:1px solid var(--line);min-height:38px;
}
.thumb-ai:empty{display:none}
.thumb-ai-btn{
  font-family:var(--mono);font-size:10px;letter-spacing:.6px;
  background:transparent;border:1px solid var(--line-hot);color:var(--muted);
  padding:4px 9px;cursor:pointer;transition:border-color .15s,color .15s;
}
.thumb-ai-btn:hover{border-color:var(--accent);color:var(--accent)}
.thumb-ai-spin{font-family:var(--mono);font-size:10px;color:var(--accent);letter-spacing:.5px}
.thumb-ai-signal{
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.5px;
  padding:2px 7px;border:1px solid currentColor;
}
.thumb-ai-signal.bullish{color:var(--call)}
.thumb-ai-signal.bearish{color:var(--put)}
.thumb-ai-signal.neutral,.thumb-ai-signal.unavailable{color:var(--faint)}
.thumb-ai-conf{font-family:var(--mono);font-size:10.5px;color:var(--muted)}

.sparkline-svg{width:100%;height:64px;display:block}
.spark-grid line{stroke:var(--line);stroke-width:1;stroke-dasharray:2 4}

/* ------------------------- VISTA DE DETALLE ------------------------- */
#detailView{display:grid;gap:16px}
.result-card{
  background:var(--panel);border:1px solid var(--line);
  padding:24px;
}
.result-card h3{
  margin:26px 0 4px;font-size:17px;font-weight:700;letter-spacing:-.2px;
}
.result-card h4{margin:18px 0 8px;font-size:14px;font-weight:700;color:var(--text)}
.card-head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;
  border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:14px;
}
.ticker{font-family:var(--mono);font-weight:800;font-size:25px;letter-spacing:.5px}
.description,.company-info{color:var(--muted);font-size:13px;margin-top:2px}
.badges{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.badge,.pill{
  display:inline-flex;align-items:center;gap:5px;
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.8px;
  padding:4px 10px;border:1px solid var(--line-hot);
  background:var(--bg-soft);color:var(--muted);text-transform:uppercase;
}
.badge.call,.pill.call{color:var(--call);border-color:var(--call);background:var(--call-soft)}
.badge.put,.pill.put{color:var(--put);border-color:var(--put);background:var(--put-soft)}
.badge.wait,.pill.wait{color:var(--wait);border-color:var(--wait);background:var(--wait-soft)}
.pill.preferred-pill{color:#0c1015;background:var(--accent);border-color:var(--accent)}
.preferred-detail{padding:12px 16px;margin:10px 0;font-size:13px;color:var(--muted);background:var(--bg-soft)}
.preferred-detail.opportunity{border-left:3px solid var(--accent)}
.preferred-detail.watch{border-left:3px solid var(--wait)}
.confidence-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.confidence-chip{
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.8px;
  padding:3px 9px;background:var(--bg-soft);border:1px solid var(--line-hot);color:var(--accent);
}
.grade{
  font-family:var(--mono);font-weight:600;font-size:9.5px;letter-spacing:.8px;
  color:var(--faint);text-transform:uppercase;white-space:nowrap;
}

/* Métricas: etiqueta arriba, valor grande debajo, nota a la derecha */
.metrics{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:10px;margin:14px 0}
.card-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr);gap:20px;margin:14px 0;align-items:start}
.metric{background:var(--bg-soft);border:1px solid var(--line);padding:12px 14px}
.metric-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px}
.metric-head>div:first-child{display:flex;flex-direction:column;gap:3px;min-width:0}
.metric-head span{font-size:10px;letter-spacing:.8px;color:var(--faint);font-weight:600;text-transform:uppercase}
.metric-head strong{font-family:var(--mono);font-size:16px;font-weight:700;color:var(--text)}
.meter{
  position:relative;height:9px;overflow:visible;margin-top:8px;
  background:linear-gradient(90deg,var(--put-strong) 0%,var(--wait-strong) 42%,var(--call-strong) 100%);
  box-shadow:0 0 10px rgba(0,0,0,.5) inset;
}
.meter-fill{
  height:100%;background:rgba(0,0,0,.55);
  border-right:3px solid #fff;
  box-shadow:0 0 8px rgba(255,255,255,.7);
  margin-left:auto;position:absolute;right:0;top:0;
}

/* Recomendación */
.recommendation{border:1px solid var(--line);border-left:3px solid var(--accent);background:var(--bg-soft);padding:14px 18px;margin:14px 0}
.rec-line{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin:4px 0}
.rec-tag{
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:1px;
  padding:3px 9px;text-transform:uppercase;border:1px solid;
}
.rec-tag.call{color:var(--call);border-color:var(--call);background:var(--call-soft)}
.rec-tag.put{color:var(--put);border-color:var(--put);background:var(--put-soft)}
.rec-tag.wait{color:var(--wait);border-color:var(--wait);background:var(--wait-soft)}
.analysis{color:var(--muted);font-size:13.5px}
.analysis strong{color:var(--text)}
.warning,.filter-warning{
  border-left:3px solid var(--wait);background:var(--wait-soft);
  color:var(--muted);padding:9px 14px;margin:8px 0;font-size:12.5px;
}

/* Gráficas */
.chart-stack{display:grid;gap:16px;margin:16px 0}
.chart-panel{position:relative;background:var(--bg-soft);border:1px solid var(--line);padding:16px;overflow:hidden}
.chart-panel.outcome-gain{border:2px solid var(--call-strong);box-shadow:inset 0 0 0 1px rgba(53,227,156,.16)}
.chart-panel.outcome-loss{border:2px solid var(--put-strong);box-shadow:inset 0 0 0 1px rgba(255,95,120,.16)}
.chart-panel.outcome-neutral{border:2px solid var(--wait-strong);box-shadow:inset 0 0 0 1px rgba(255,183,49,.14)}
.chart-panel.outcome-gain .chart-kicker{color:var(--call-strong)}
.chart-panel.outcome-loss .chart-kicker{color:var(--put-strong)}
.chart-panel.outcome-neutral .chart-kicker{color:var(--wait-strong)}
.chart-kicker{
  font-family:var(--mono);font-size:10px;letter-spacing:2px;color:var(--accent);font-weight:700;
  text-transform:uppercase;margin-right:8px;
}
.chart-toolbar{
  display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap;
  border-bottom:1px solid var(--line);padding-bottom:10px;
}
.chart-fullscreen-button,[data-chart-fullscreen]{
  border:1px solid var(--line-hot);background:var(--panel-2);color:var(--muted);
  font-family:var(--mono);font-size:10px;letter-spacing:1px;
  padding:6px 12px;cursor:pointer;transition:.15s;text-transform:uppercase;
}
.chart-fullscreen-button:hover,[data-chart-fullscreen]:hover{border-color:var(--accent);color:var(--accent)}
.chart{width:100%}
.chart-panel.is-fullscreen{padding:8px;background:#090c10;border:none}
.chart-panel.is-fullscreen .chart-guide,
.chart-panel.is-fullscreen .chart-level-strip,
.chart-panel.is-fullscreen .chart-toolbar{display:none}
.chart-panel:fullscreen .modebar-container{display:none!important}
.chart-panel:fullscreen{background:#090c10}
.fullscreen-exit{
  position:fixed;top:14px;right:16px;z-index:99;
  border:1px solid var(--line-hot);background:rgba(12,16,21,.95);color:var(--text);
  font-family:var(--mono);font-size:16px;
  width:36px!important;height:36px;padding:0;display:grid;place-items:center;cursor:pointer;
}
.chart-guide{margin-top:12px;border-top:1px solid var(--line);padding-top:12px}
.chart-guide-head{font-size:12.5px;color:var(--muted);margin-bottom:8px}
.chart-guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}
.guide-card{
  background:var(--panel-2);border:1px solid var(--line);padding:10px 12px;
  display:flex;flex-direction:column;gap:4px;
}
.guide-card strong{font-size:12px;color:var(--text)}
.guide-card span{font-size:11.5px;color:var(--muted);line-height:1.5}
.chart-level-strip{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.chart-level-strip>*{
  font-family:var(--mono);font-size:10.5px;
  background:var(--panel-2);border:1px solid var(--line);
  padding:5px 10px;color:var(--muted);
}
.chart-level.placeholder{opacity:.45}

/* Contratos */
.option-list{display:grid;gap:12px;margin:14px 0}
.option-card{background:var(--bg-soft);border:1px solid var(--line);padding:18px;transition:.15s}
.option-card:hover{border-color:var(--accent)}
.option-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.contract{font-family:var(--mono);font-weight:700;font-size:14px;letter-spacing:.4px}
.option-score{text-align:center;background:var(--panel-2);border:1px solid var(--line-hot);padding:8px 14px}
.option-score-number{font-family:var(--mono);font-weight:800;font-size:19px;color:var(--accent)}
.option-metrics{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:10px}
.option-education{margin-top:12px;border-top:1px dashed var(--line-hot);padding-top:12px;font-size:12.5px;color:var(--muted)}
.option-education-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin-top:8px}

/* Tarjetas de proyección: etiqueta / valor / descripción en columna */
.projection-panel{border:1px solid var(--line);background:var(--bg-soft);padding:18px;margin:14px 0}
.projection-panel.call{border-left:3px solid var(--call)}
.projection-panel.put{border-left:3px solid var(--put)}
.projection-panel.wait{border-left:3px solid var(--wait)}
.projection-head{
  display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;
  margin-bottom:10px;border-bottom:1px solid var(--line);padding-bottom:10px;
}
.projection-summary{color:var(--muted);font-size:13.5px;line-height:1.6}
.projection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:10px;margin-top:12px}
.projection-grid.one{grid-template-columns:1fr}
.projection-card{
  background:var(--panel-2);border:1px solid var(--line);padding:13px 15px;
  display:flex;flex-direction:column;gap:5px;
}
.projection-card small{font-size:10px;letter-spacing:.8px;color:var(--faint);font-weight:600;text-transform:uppercase}
.projection-card strong{font-family:var(--mono);font-size:17px;font-weight:700;color:var(--text)}
.projection-card span{font-size:11.5px;color:var(--muted);line-height:1.5}
.projection-card.emphasis{border-color:var(--accent);border-left-width:3px}
.projection-card.profit{border-left:3px solid var(--call)}
.projection-card.target-pnl.positive{border-left:3px solid var(--call)}
.projection-card.target-pnl.positive strong{color:var(--call)}
.projection-card.target-pnl.negative{border-left:3px solid var(--put)}
.projection-card.target-pnl.negative strong{color:var(--put)}
.projection-card.target-pnl.neutral{border-left:3px solid var(--wait)}
.projection-card.target-pnl.neutral strong{color:var(--wait)}

/* Simulación histórica */
.history-simulation{border:1px solid var(--line);background:var(--bg-soft);padding:18px;margin:14px 0}
.history-simulation.unavailable{opacity:.7}
.simulation-head{
  display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:baseline;
  border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:12px;
}
.simulation-kicker{font-family:var(--mono);font-size:10px;letter-spacing:2px;color:var(--accent);font-weight:700;text-transform:uppercase}
.simulation-budget{font-family:var(--mono);color:var(--muted);font-size:12px}
.simulation-contract-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px;margin:12px 0}
.simulation-contract-grid>div{
  background:var(--panel-2);border:1px solid var(--line);padding:10px 12px;
  display:flex;flex-direction:column;gap:3px;
}
.simulation-contract-grid small{font-size:9.5px;letter-spacing:.6px;color:var(--faint);font-weight:600;text-transform:uppercase}
.simulation-contract-grid strong{font-family:var(--mono);font-size:14.5px;font-weight:700}
.simulation-explain,.simulation-note{color:var(--muted);font-size:13px;line-height:1.6}
.realized-result{font-family:var(--mono);font-weight:700}
.realized-result.no-trade{color:var(--faint)}

/* Ecuación de capital: cajas iguales, centradas, valor protagonista */
.historical-equation{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap;margin:14px 0}
.equation-card{
  flex:1;min-width:160px;background:var(--panel-2);border:1px solid var(--line);
  padding:14px 16px;text-align:center;
  display:flex;flex-direction:column;gap:5px;justify-content:center;
}
.equation-card small{font-size:9.5px;letter-spacing:1px;color:var(--faint);font-weight:700;text-transform:uppercase}
.equation-card strong{font-family:var(--mono);font-size:20px;font-weight:800;color:var(--text)}
.equation-card span{font-size:11px;color:var(--muted);line-height:1.4}
.equation-card.capital{border-top:2px solid var(--accent)}
.equation-card.total{border-top:2px solid var(--accent-2)}
.equation-card.positive,.equation-card.gain{background:var(--call-soft);border-color:var(--call)}
.equation-card.positive strong,.equation-card.gain strong{color:var(--call)}
.equation-card.negative,.equation-card.loss{background:var(--put-soft);border-color:var(--put)}
.equation-card.negative strong,.equation-card.loss strong{color:var(--put)}
.equation-card.neutral{background:var(--wait-soft);border-color:var(--wait)}
.equation-card.neutral strong{color:var(--wait)}
.target-profit-panel.positive .target-profit-result strong{color:var(--call)}
.target-profit-panel.negative .target-profit-result strong{color:var(--put)}
.target-profit-panel.neutral .target-profit-result strong{color:var(--wait)}
.equation-operator{align-self:center;font-size:20px;font-weight:700;color:var(--faint);font-family:var(--mono)}
.equation-detail{font-size:11px;color:var(--faint);margin-top:2px}

/* Escenarios y score */
.scenario-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin:12px 0}
.scenario-box{
  background:var(--panel-2);border:1px solid var(--line);padding:12px 14px;
  display:flex;flex-direction:column;gap:4px;
}
.scenario-stat{font-family:var(--mono);font-weight:800;font-size:16px}
.scenario-caption{font-size:11px;color:var(--faint)}
.score-box{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:12px 0}
.score-header{font-family:var(--mono);font-size:10px;letter-spacing:1.2px;color:var(--faint);font-weight:700;text-transform:uppercase}
.score-gauge{
  position:relative;flex:1;min-width:200px;max-width:340px;height:10px;
  background:linear-gradient(90deg,var(--put-strong) 0%,var(--wait-strong) 42%,var(--call-strong) 100%);
  margin-top:10px;box-shadow:0 0 12px rgba(0,0,0,.45) inset;
}
.gauge-arrow{
  position:absolute;top:-10px;transform:translateX(-50%);
  width:0;height:0;border:8px solid transparent;border-top-color:#fff;border-bottom:none;
  filter:drop-shadow(0 0 4px rgba(255,255,255,.8));transition:left .4s;
}
.gauge-labels{display:flex;justify-content:space-between;font-family:var(--mono);font-size:9.5px;color:var(--faint)}
.score-value{font-family:var(--mono);font-weight:800;font-size:24px}
.score-caption{font-size:11.5px;color:var(--muted)}

/* Resultado al objetivo / payoff */
.target-profit-head{
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:flex-end;
  margin-bottom:12px;border-bottom:1px solid var(--line);padding-bottom:12px;
}
.target-profit-head>div{display:flex;flex-direction:column;gap:4px}
.target-profit-head small{font-size:9.5px;letter-spacing:1px;color:var(--faint);font-weight:700;text-transform:uppercase}
.target-profit-head strong{font-family:var(--mono);font-size:18px;font-weight:800}
.target-profit-result{text-align:right}
.target-profit-grid,.target-profit-grid.six{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:10px;margin:12px 0}
.target-profit-grid>div{
  background:var(--panel-2);border:1px solid var(--line);padding:11px 13px;
  display:flex;flex-direction:column;gap:4px;
}
.target-profit-grid>div small{font-size:9.5px;letter-spacing:.6px;color:var(--faint);font-weight:600;text-transform:uppercase}
.target-profit-grid>div strong{font-family:var(--mono);font-size:15px;font-weight:700}
.target-profit-panel{background:var(--bg-soft);border:1px solid var(--line);padding:18px 20px;margin:14px 0}
.target-profit-panel.positive{border-left:3px solid var(--call)}
.target-profit-panel.negative{border-left:3px solid var(--put)}
.target-profit-panel.neutral{border-left:3px solid var(--wait)}
.target-profit-panel.reference{border-style:dashed}
.payoff-wrap{background:var(--panel-2);border:1px solid var(--line);padding:12px;margin:12px 0}
.payoff-svg{width:100%;display:block}
.payoff-marker{font-family:var(--mono);font-size:10px}
.swatch{display:inline-block;width:10px;height:10px;margin-right:5px;vertical-align:middle}
.swatch.actual{background:var(--accent)}
.swatch.breakeven{background:var(--wait)}
.swatch.strike{background:var(--accent-2)}

/* Explicaciones: párrafos y listas legibles */
.result-card p{margin:10px 0;line-height:1.65;color:var(--muted)}
.result-card p strong{color:var(--text)}
.result-card ul{margin:12px 0;padding-left:20px;display:grid;gap:6px}
.result-card li{color:var(--muted);line-height:1.55}
.result-card li strong,.result-card li b{color:var(--text);font-family:var(--mono)}

/* Franja de proyección bajo la gráfica */
.projection-strip{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;
  margin-top:12px;border-top:1px solid var(--line);padding-top:12px;
}
.projection-strip>div{
  background:var(--panel-2);border:1px solid var(--line);padding:9px 12px;
  display:flex;flex-direction:column;gap:3px;
}
.projection-strip>div small{font-size:9px;letter-spacing:.7px;color:var(--faint);font-weight:700;text-transform:uppercase}
.projection-strip>div strong{font-family:var(--mono);font-size:13px;font-weight:700;white-space:nowrap}
.projection-strip.positive>div:first-child{border-left:3px solid var(--call)}
.projection-strip.negative>div:first-child{border-left:3px solid var(--put)}
.projection-strip.neutral>div:first-child{border-left:3px solid var(--wait)}
.projection-strip strong.positive{color:var(--call)}
.projection-strip strong.negative{color:var(--put)}
.projection-strip strong.neutral{color:var(--wait)}
.chart-panel.is-fullscreen .projection-strip{display:none}

/* Estados genéricos */
.negative{color:var(--put)}
.positive{color:var(--call)}
.caution{color:var(--wait)}
.danger{color:var(--danger)}

/* =============================== PIE ================================ */
.nx-footer{border-top:1px solid var(--line-hot);background:var(--panel);margin-top:30px}
.nx-footer-inner{
  max-width:1560px;margin:0 auto;padding:24px 22px 30px;
  display:grid;grid-template-columns:auto auto;gap:16px;align-items:center;justify-content:space-between;
}
.nx-disclaimer{
  grid-column:1 / -1;margin:4px 0 0;color:var(--faint);font-size:11.5px;line-height:1.6;
  border-top:1px solid var(--line);padding-top:14px;
}

/* ============================ RESPONSIVE ============================ */
@media (max-width: 1120px){
  .nx-shell{grid-template-columns:1fr}
  .nx-indices{display:none}
  .nx-right{order:-1}
  #scanHours{order:-1}
  .nx-sidebar{position:static;max-height:none;overflow:visible}
}
@media (max-width: 1250px){
  .card-grid{grid-template-columns:1fr}
}
@media (max-width: 720px){
  body.nx-body{font-size:14px}
  .nx-topbar-inner{justify-content:center;padding:8px 12px}
  .nx-role{display:none}
  .nx-shell{padding:12px 12px 40px}
  .nx-content-head h1{font-size:18px}
  .result-card{padding:14px}
  .nx-footer-inner{grid-template-columns:1fr;justify-items:center;text-align:center}
  .thumb-grid{grid-template-columns:1fr 1fr}
  .nx-filter-grid{grid-template-columns:1fr 1fr}
  .projection-strip{grid-template-columns:1fr 1fr}
  .historical-equation{flex-direction:column}
  .equation-operator{transform:rotate(90deg)}
  .metrics{grid-template-columns:1fr 1fr}
  .target-profit-grid,.target-profit-grid.six{grid-template-columns:1fr 1fr}
  .simulation-contract-grid{grid-template-columns:1fr 1fr}
  input[type=number],textarea{font-size:16px} /* evita zoom automático de iOS */
}
@media (max-width: 480px){
  .thumb-grid{grid-template-columns:1fr}
  .nx-topbar-meta{gap:5px}
  .nx-chip{padding:4px 8px;font-size:10px}
  .projection-strip{grid-template-columns:1fr}
  .card-head{flex-direction:column}
}


/* =============================== ADMIN ============================== */
.admin-body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14.5px;line-height:1.55;-webkit-font-smoothing:antialiased}
.simulation-kicker{font-family:var(--mono);font-size:10px;letter-spacing:2px;color:var(--accent);font-weight:700;text-transform:uppercase}

/* Login */
.admin-login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.admin-login-card{
  width:100%;max-width:400px;background:var(--panel);border:1px solid var(--line);
  border-top:2px solid var(--accent);padding:34px 32px;text-align:center;
}
.admin-login-logo{width:74px;height:74px;margin:0 auto 16px;overflow:hidden;border:1px solid var(--line-hot);display:grid;place-items:center;background:var(--panel-2)}
.admin-login-logo img{width:100%;height:100%;object-fit:cover;display:block}
.admin-login-logo span{display:none;font-family:var(--mono);font-weight:800;font-size:22px;color:var(--accent)}
.admin-login-card h1{margin:8px 0 4px;font-size:26px;letter-spacing:2px;font-family:var(--mono)}
.admin-login-card p{margin:0 0 20px;color:var(--muted);font-size:12.5px}
.admin-login-form{display:grid;gap:10px;text-align:left}
.admin-login-form label{font-size:10.5px;letter-spacing:1px;color:var(--muted);font-weight:700;text-transform:uppercase}
.password-field{position:relative;display:flex;align-items:center}
.password-field input{width:100%;background:var(--bg-soft);border:1px solid var(--line-hot);color:var(--text);font-family:var(--mono);font-size:15px;padding:11px 42px 11px 12px;outline:none}
.password-field input:focus{border-color:var(--accent)}
.password-toggle{position:absolute;right:6px;background:none;border:none;cursor:pointer;padding:6px;display:grid;place-items:center}
.password-toggle svg{width:18px;height:18px;fill:none;stroke:var(--faint);stroke-width:1.6}
.password-toggle:hover svg{stroke:var(--text)}
.admin-login-submit{
  margin-top:6px;border:none;background:var(--accent);color:#101113;cursor:pointer;
  font-weight:800;font-size:13.5px;letter-spacing:.5px;padding:12px;transition:.15s;
}
.admin-login-submit:hover{background:#fff}
.admin-login-submit:disabled{opacity:.5}
.admin-login-error{margin-top:14px;background:var(--put-soft);border:1px solid var(--put);border-left:3px solid var(--put);color:#e6aab4;padding:10px 14px;font-size:12.5px;text-align:left}
.admin-back-link{display:inline-block;margin-top:18px;color:var(--muted);font-size:12.5px}
.admin-back-link:hover{color:var(--accent)}

/* Panel */
.brand-strip.admin-topbar{
  position:sticky;top:0;z-index:50;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;
  background:rgba(16,17,19,.94);border-bottom:1px solid var(--line-hot);padding:10px 22px;
}
.brand-left{display:flex;align-items:center;gap:12px}
.brand-logo{width:40px;height:40px;overflow:hidden;border:1px solid var(--line-hot);display:grid;place-items:center;background:var(--panel-2);flex:0 0 auto}
.brand-logo img{width:100%;height:100%;object-fit:cover;display:block}
.brand-logo span{display:none;font-family:var(--mono);font-weight:800;color:var(--accent)}
.brand-name{font-weight:700;letter-spacing:.8px;font-size:13.5px}
.brand-subtitle{color:var(--muted);font-size:11px;font-family:var(--mono);letter-spacing:.5px}
.admin-top-actions{display:flex;gap:8px;align-items:center}
.admin-secondary-button,.admin-logout-button{
  display:inline-flex;align-items:center;border:1px solid var(--line-hot);background:var(--panel);
  color:var(--text);font-family:var(--mono);font-size:11px;letter-spacing:.8px;font-weight:700;
  padding:7px 14px;cursor:pointer;text-transform:uppercase;transition:.15s;
}
.admin-secondary-button:hover{border-color:var(--accent)}
.admin-logout-button{border-color:var(--put);color:var(--put)}
.admin-logout-button:hover{background:var(--put-soft)}
.admin-main{max-width:1280px;margin:0 auto;padding:26px 22px 60px;display:grid;gap:18px}
.admin-heading h1{margin:4px 0 2px;font-size:22px}
.admin-heading p{margin:0;color:var(--muted);font-size:13px}
.admin-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.admin-stat-card{
  background:var(--panel);border:1px solid var(--line);border-top:2px solid var(--accent);
  padding:16px 18px;display:flex;flex-direction:column;gap:4px;
}
.admin-stat-card small{font-size:9.5px;letter-spacing:1.2px;color:var(--faint);font-weight:700}
.admin-stat-card strong{font-family:var(--mono);font-size:26px;font-weight:800}
.admin-stat-card span{font-size:11.5px;color:var(--muted)}
.admin-panel{background:var(--panel);border:1px solid var(--line);padding:18px 20px}
.admin-section-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px;border-bottom:1px solid var(--line);padding-bottom:10px}
.admin-section-head h2{margin:0;font-size:15px}
.admin-section-head p{margin:0;color:var(--faint);font-size:12px}
.visitor-map{width:100%;min-height:320px;background:var(--bg-soft);border:1px solid var(--line)}
.admin-empty-map{display:grid;place-items:center;min-height:200px;color:var(--faint);border:1px dashed var(--line-hot)}
.admin-table-wrap{overflow-x:auto}
.admin-table{width:100%;border-collapse:collapse;font-size:12.5px}
.admin-table th{
  text-align:left;font-family:var(--mono);font-size:10px;letter-spacing:1px;color:var(--faint);
  text-transform:uppercase;border-bottom:1px solid var(--line-hot);padding:8px 10px;white-space:nowrap;
}
.admin-table td{border-bottom:1px solid var(--line);padding:9px 10px;color:var(--muted);vertical-align:top}
.admin-table tr:hover td{background:var(--accent-soft);color:var(--text)}
.admin-ip{font-family:var(--mono);color:var(--text);font-weight:600}
.admin-device-name{color:var(--accent-2);font-size:11px}
.admin-visit-badge{
  display:inline-block;font-family:var(--mono);font-weight:700;font-size:11px;
  background:var(--panel-2);border:1px solid var(--line-hot);padding:2px 9px;color:var(--text);
}
.admin-security-panel .admin-password-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.admin-password-change-form{display:grid;gap:12px}
.admin-password-change-form label{font-size:10.5px;letter-spacing:1px;color:var(--muted);font-weight:700;text-transform:uppercase;display:block;margin-bottom:5px}
.admin-password-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.admin-password-message{font-size:12.5px;color:var(--muted)}
.admin-password-message.positive{color:var(--call)}
.admin-password-message.negative{color:var(--put)}
.admin-privacy-note{color:var(--faint);font-size:11.5px;line-height:1.6}
@media (max-width:720px){
  .brand-strip.admin-topbar{justify-content:center}
  .admin-main{padding:14px 12px 40px}
}


/* ===================== TOQUE DE COLOR (acento cian) ==================== */
/* Línea superior viva en la barra y el pie */
.nx-topbar::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,var(--spark),transparent 42%);
}
.nx-topbar{position:sticky}
.nx-footer::after{
  content:"";position:absolute;top:-1px;left:0;width:200px;height:2px;background:var(--accent);
}
.nx-footer{position:relative}

/* Los títulos de tarjeta llevan una barra ámbar en vez de un punto: es la
   firma visual del tema y lo que más rápido distingue este proyecto del
   Analizador de Opciones cuando los dos están abiertos en pestañas contiguas. */
.nx-card-h::before{
  content:"";display:inline-block;width:3px;height:11px;margin-right:9px;
  background:var(--accent);vertical-align:-1px;
}
.nx-health::before{
  content:"";display:inline-block;width:6px;height:6px;margin-right:7px;
  background:var(--call);box-shadow:0 0 7px var(--call);
}

/* Borde superior de tarjetas y foco de inputs con el acento ámbar */
.nx-card{border-top-color:var(--accent)}
.admin-login-card,.admin-stat-card{border-top-color:var(--accent)}
textarea:focus,input:focus,select:focus{
  border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft);
}
.money-preset.active{background:var(--accent);border-color:var(--accent);color:var(--bg)}
#scanButton{background:var(--spark);color:#08131a}
#scanButton:hover{background:#5fd7f7}
.nx-version{background:var(--spark);border-color:var(--spark);color:#08131a}
.nx-version b{color:#08131a}
.nx-content-head{position:relative}
.nx-content-head::after{
  content:"";position:absolute;left:0;bottom:-1px;width:64px;height:2px;background:var(--spark);
}
.thumb-card.active{border-color:var(--spark);box-shadow:inset 0 0 0 1px var(--spark)}
.thumb-card:hover{border-color:var(--spark)}
.preferred-badge{background:var(--spark);color:#08131a}
.simulation-kicker,.chart-kicker,.nx-kicker{color:var(--spark)}
.dte-selected-range{background:var(--spark)}
input[type=range].dte-range-slider::-webkit-slider-thumb{background:var(--spark)}
.option-score-number{color:var(--spark)}
.meter-fill{border-right-color:#fff}

/* =====================================================================
   CAPA DE ANÁLISIS AI LOCAL
   Deliberadamente distinta del resto de la interfaz: banda violeta y fondo
   propio, para que a simple vista quede claro dónde terminan los cálculos
   deterministas y dónde empieza la interpretación de un modelo.
   ===================================================================== */
:root{
  --ai:        #a78bfa;
  --ai-strong: #c4b5fd;
  --ai-soft:   rgba(167,139,250,.09);
  --ai-line:   rgba(167,139,250,.32);
}

/* Indicador de estado en la barra superior */
.nx-ai{color:var(--faint)}
.nx-ai.ready{color:var(--ai-strong);border-color:var(--ai-line)}
.nx-ai.cold{color:var(--ai)}
.nx-ai.down{color:var(--danger)}
.nx-ai.off{color:var(--faint)}

/* Contenedor */
.ai-panel{
  margin:18px 0;padding:0;
  background:var(--bg-soft);
  border:1px solid var(--line);
  border-left:3px solid var(--ai);
}
.ai-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  padding:14px 18px;border-bottom:1px solid var(--line);background:var(--ai-soft);
}
.ai-head h3{margin:0 0 6px;font-size:14px;letter-spacing:.4px;color:var(--ai-strong);display:flex;align-items:center;gap:10px}
.ai-badge{
  font-family:var(--mono);font-size:9.5px;letter-spacing:1px;font-weight:700;
  text-transform:uppercase;color:#12101a;background:var(--ai);padding:3px 8px;
}
.ai-disclaimer{margin:0;font-size:11.5px;line-height:1.6;color:var(--muted);max-width:74ch}
.ai-disclaimer strong{color:var(--ai-strong)}
.ai-body{padding:16px 18px}

/* Estados transitorios */
.ai-idle{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.ai-idle p{margin:0;color:var(--muted);font-size:13px}
.ai-loading{display:flex;align-items:center;gap:14px;color:var(--muted);font-size:13px}
.ai-loading .spinner{border-top-color:var(--ai)}
.ai-loading strong{display:block;color:var(--text);font-size:13.5px}
.ai-loading small{color:var(--faint);font-size:11.5px}
.ai-error{border-left:3px solid var(--danger);background:var(--put-soft);padding:12px 16px}
.ai-error strong{color:var(--danger);font-size:13px}
.ai-error p{margin:6px 0 0;font-size:12.5px;color:var(--muted)}
.ai-fallback-note{color:var(--faint)!important;font-size:11.5px!important;font-style:italic}

/* Botón */
button.ai-run{
  border:1px solid var(--ai-line);background:var(--ai-soft);color:var(--ai-strong);
  font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.6px;
  text-transform:uppercase;padding:9px 16px;cursor:pointer;transition:.15s;
}
button.ai-run:hover{background:var(--ai);color:#12101a;border-color:var(--ai)}
button.ai-run.ghost{padding:5px 11px;font-size:10px;opacity:.75}
button.ai-run.ghost:hover{opacity:1}

/* Veredicto */
.ai-verdict{
  display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;
  padding:12px 16px;border:1px solid var(--line);background:var(--panel);margin-bottom:14px;
}
.ai-signal{
  font-family:var(--mono);font-size:15px;font-weight:700;letter-spacing:1.2px;
  padding:9px 16px;border:1px solid var(--line-hot);
}
.ai-signal.bullish{color:var(--call-strong);border-color:var(--call);background:var(--call-soft)}
.ai-signal.bearish{color:var(--put-strong);border-color:var(--put);background:var(--put-soft)}
.ai-signal.neutral{color:var(--wait-strong);border-color:var(--wait);background:var(--wait-soft)}
.ai-confidence span,.ai-quality span{
  display:block;font-size:9.5px;letter-spacing:.9px;color:var(--faint);
  font-weight:600;text-transform:uppercase;
}
.ai-confidence strong,.ai-quality strong{font-family:var(--mono);font-size:17px;color:var(--text)}
.ai-confidence.high strong{color:var(--call-strong)}
.ai-confidence.mid strong{color:var(--wait-strong)}
.ai-confidence.low strong{color:var(--put-strong)}
.ai-quality{text-align:right}

.ai-summary{
  margin:0 0 16px;font-size:14px;line-height:1.65;color:var(--text);
  border-left:2px solid var(--ai-line);padding-left:14px;
}

/* Listas y prosa */
.ai-columns{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-bottom:14px}
.ai-list,.ai-prose{border:1px solid var(--line);background:var(--panel);padding:11px 15px}
.ai-list h5,.ai-prose h5,.ai-conclusion h5{
  margin:0 0 8px;font-size:9.5px;letter-spacing:1px;text-transform:uppercase;
  color:var(--faint);font-weight:700;
}
.ai-list ul{margin:0;padding-left:17px}
.ai-list li{font-size:12.5px;line-height:1.6;color:var(--muted);margin-bottom:5px}
.ai-list li::marker{color:var(--faint)}
.ai-prose p{margin:0;font-size:12.5px;line-height:1.6;color:var(--muted)}
.ai-list.positive{border-left:2px solid var(--call)}
.ai-list.positive h5{color:var(--call)}
.ai-list.negative{border-left:2px solid var(--put)}
.ai-list.negative h5{color:var(--put)}
.ai-list.contradiction{border-left:2px solid var(--wait);margin-bottom:14px}
.ai-list.contradiction h5{color:var(--wait-strong)}
.ai-list.invalidation{border-left:2px solid var(--danger);margin-bottom:14px}
.ai-list.invalidation h5{color:var(--danger)}
/* La información faltante se destaca: es la señal de que hay que desconfiar. */
.ai-list.missing{border:1px dashed var(--wait);background:var(--wait-soft);margin-bottom:14px}
.ai-list.missing h5{color:var(--wait-strong)}
.ai-list.missing li{color:var(--text)}

.ai-conclusion{border:1px solid var(--ai-line);background:var(--ai-soft);padding:13px 16px;margin-bottom:14px}
.ai-conclusion p{margin:0;font-size:13.5px;line-height:1.65;color:var(--text)}

/* Procedencia */
.ai-footer{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;
  padding-top:12px;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:10px;letter-spacing:.4px;color:var(--faint);
}
.ai-footer strong{color:var(--muted);font-weight:600}
.ai-flag{color:var(--wait);border:1px solid var(--line-hot);padding:2px 8px}

@media (max-width:720px){
  .ai-verdict{grid-template-columns:1fr;gap:12px;text-align:left}
  .ai-quality{text-align:left}
  .ai-head{flex-direction:column;gap:10px}
}

/* ---------- Interruptor de encendido/apagado de la AI ---------- */
.nx-ai-toggle{
  cursor:pointer;gap:8px;font-family:var(--mono);transition:.15s;
  background:var(--panel);border:1px solid var(--line-hot);color:var(--faint);
}
.nx-ai-toggle:hover{border-color:var(--ai);color:var(--ai-strong)}
.nx-ai-toggle:disabled{opacity:.5;cursor:progress}
.nx-ai-toggle:focus-visible{outline:2px solid var(--ai);outline-offset:2px}
/* El led hace obvio el estado sin tener que leer la etiqueta. */
.nx-ai-led{
  width:8px;height:8px;flex:0 0 auto;
  background:var(--faint);box-shadow:none;transition:.15s;
}
.nx-ai-toggle.on{color:var(--ai-strong);border-color:var(--ai-line);background:var(--ai-soft)}
.nx-ai-toggle.on .nx-ai-led{background:var(--ai-strong);box-shadow:0 0 7px var(--ai)}
.nx-ai-toggle.off{color:var(--faint)}
.nx-ai-toggle.off .nx-ai-led{background:var(--line-hot)}

/* ---------- Franja de AI en cada miniatura ---------- */
.thumb-ai{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin-top:9px;padding-top:9px;border-top:1px dashed var(--line-hot);
  font-family:var(--mono);font-size:10px;letter-spacing:.4px;
}
.thumb-ai.idle{justify-content:stretch}
button.thumb-ai-btn{
  flex:1 1 auto;
  border:1px solid var(--ai-line);background:var(--ai-soft);color:var(--ai-strong);
  font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.7px;
  text-transform:uppercase;padding:7px 10px;cursor:pointer;transition:.15s;
}
button.thumb-ai-btn:hover{background:var(--ai);color:#12101a;border-color:var(--ai)}
button.thumb-ai-btn.ghost{flex:0 0 auto;padding:4px 8px;font-size:11px;line-height:1}

.thumb-ai.loading{color:var(--ai)}
.thumb-ai-spin{
  width:11px;height:11px;flex:0 0 auto;
  border:2px solid var(--line-hot);border-top-color:var(--ai);
  animation:nx-spin .7s linear infinite;
}
.thumb-ai.failed{color:var(--danger)}
.thumb-ai.failed span{flex:1 1 auto;cursor:help}

.thumb-ai.done .thumb-ai-signal{font-weight:700;color:var(--ai-strong)}
.thumb-ai.done.bullish .thumb-ai-signal{color:var(--call-strong)}
.thumb-ai.done.bearish .thumb-ai-signal{color:var(--put-strong)}
.thumb-ai.done.neutral .thumb-ai-signal{color:var(--wait-strong)}
.thumb-ai-conf{border:1px solid var(--line-hot);padding:2px 7px;color:var(--muted)}
.thumb-ai-conf.high{color:var(--call-strong);border-color:var(--call)}
.thumb-ai-conf.mid{color:var(--wait-strong);border-color:var(--wait)}
.thumb-ai-conf.low{color:var(--put-strong);border-color:var(--put)}
.thumb-ai-quality{color:var(--faint);flex:1 1 auto}

/* ---------- Bombillos de estado M1 / M4 en la barra superior ---------- */
.nx-nodes{gap:16px;font-family:var(--mono);padding:5px 14px}
.nx-node{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:11px;cursor:help}
/* `display:block` explícito: <i> es inline por defecto y ahí width/height se
   ignoran. Como hijo flex normalmente funcionaría, pero no vale la pena
   depender de eso para el elemento más visible de la barra. */
.nx-led{
  display:block;width:10px;height:10px;flex:0 0 auto;
  border-radius:50%!important;transition:.2s;
  /* Estado por defecto ya visible: un gris apagado con borde, para que nunca
     quede un hueco invisible si el JS todavía no ha respondido. */
  background:var(--panel-2);border:1.5px solid var(--faint);box-sizing:border-box;
}
/* Verde con halo y latido suave cuando el nodo está vivo. */
.nx-node.on{color:var(--call-strong)}
.nx-node.on .nx-led{
  background:var(--call-strong);border-color:var(--call-strong);
  box-shadow:0 0 9px var(--call-strong);animation:nx-pulse 2.4s ease-in-out infinite;
}
.nx-node.warn{color:var(--wait-strong)}
.nx-node.warn .nx-led{
  background:var(--wait-strong);border-color:var(--wait-strong);box-shadow:0 0 8px var(--wait);
}
.nx-node.off{color:var(--danger)}
.nx-node.off .nx-led{
  background:var(--danger);border-color:var(--danger);
  box-shadow:0 0 8px var(--danger);animation:nx-blink 1.3s step-end infinite;
}
@keyframes nx-pulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes nx-blink{0%,49%{opacity:1}50%,100%{opacity:.25}}

/* ---------- Robot pensando ---------- */
.ai-thinking{display:flex;align-items:flex-start;gap:16px;padding:6px 0}
.ai-robot{flex:0 0 auto;width:54px;height:58px}
.ai-robot svg{width:100%;height:100%;overflow:visible}
.ai-robot .r-head,.ai-robot .r-body{fill:var(--panel-2);stroke:var(--ai);stroke-width:1.6}
.ai-robot .r-antenna,.ai-robot .r-arm{stroke:var(--ai);stroke-width:1.6;stroke-linecap:round}
.ai-robot .r-spark{fill:var(--ai-strong);animation:r-spark 1.1s ease-in-out infinite}
.ai-robot .r-eye{fill:var(--ai-strong);animation:r-scan 2.2s ease-in-out infinite}
.ai-robot .r-eye.left{transform-origin:17px 22.5px}
.ai-robot .r-eye.right{transform-origin:31px 22.5px}
.ai-robot .r-eye.right{animation-delay:.15s}
.ai-robot .r-bar{fill:var(--ai-strong);animation:r-talk .9s ease-in-out infinite}
.ai-robot .r-bar.b1{transform-origin:17.5px 33px}
.ai-robot .r-bar.b2{transform-origin:22.5px 33px}
.ai-robot .r-bar.b3{transform-origin:27.5px 33px}
.ai-robot .r-bar.b2{animation-delay:.15s}
.ai-robot .r-bar.b3{animation-delay:.3s}
.ai-robot .r-arm.left{transform-origin:9px 42px;animation:r-wave-l 1.8s ease-in-out infinite}
.ai-robot .r-arm.right{transform-origin:39px 42px;animation:r-wave-r 1.8s ease-in-out infinite}
/* transform en vez de `r`: el radio es una propiedad geométrica SVG2 y su
   soporte por CSS es desigual. El escalado se comporta igual visualmente. */
.ai-robot .r-spark{transform-origin:24px 3px}
@keyframes r-spark{0%,100%{opacity:.3;transform:scale(.75)}50%{opacity:1;transform:scale(1.25)}}
/* Los "ojos" se estrechan y ensanchan: parece que lee de lado a lado. */
@keyframes r-scan{0%,100%{transform:scaleX(1);opacity:1}45%{transform:scaleX(.35);opacity:.6}}
@keyframes r-talk{0%,100%{transform:scaleY(1)}50%{transform:scaleY(2.6)}}
@keyframes r-wave-l{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-12deg)}}
@keyframes r-wave-r{0%,100%{transform:rotate(0deg)}50%{transform:rotate(12deg)}}

.ai-thinking-copy{flex:1 1 auto;min-width:0}
.ai-thinking-copy strong{display:block;color:var(--text);font-size:13.5px;margin-bottom:6px}
/* Tres puntos que aparecen en secuencia, el gesto universal de "escribiendo". */
.ai-dots{display:inline-flex;gap:3px;margin-left:5px;vertical-align:baseline}
.ai-dots i{width:4px;height:4px;background:var(--ai-strong);border-radius:50%!important;animation:ai-dot 1.4s ease-in-out infinite}
.ai-dots i:nth-child(2){animation-delay:.2s}
.ai-dots i:nth-child(3){animation-delay:.4s}
@keyframes ai-dot{0%,80%,100%{opacity:.2;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

.ai-thinking-meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;
  font-family:var(--mono);font-size:10.5px;color:var(--faint);margin-bottom:9px;
}
.ai-elapsed{
  color:var(--ai-strong);font-weight:700;font-size:13px;
  border:1px solid var(--ai-line);padding:1px 9px;min-width:52px;text-align:center;
}
/* Pasados 90 s se avisa en ámbar en vez de dejarlo contando en silencio. */
.ai-elapsed.slow{color:var(--wait-strong);border-color:var(--wait)}
.ai-thinking-hint{font-style:italic}

/* Enlace M1 -> M4. No es una barra de progreso: no conocemos la duración, así
   que en vez de fingir un porcentaje se muestra el hecho real, que los datos
   viajaron al iMac y este está calculando. */
.ai-link{max-width:320px;margin-top:2px}
.ai-link svg{width:100%;height:34px;overflow:visible;display:block}
.ai-link .lnk-node rect{fill:var(--panel);stroke:var(--ai-line);stroke-width:1.2}
.ai-link .lnk-node text{
  fill:var(--muted);font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.5px;
}
/* El M4 late y se resalta: es el que está trabajando de verdad. */
.ai-link .lnk-node.m4 rect{stroke:var(--ai-strong);animation:lnk-work 1.5s ease-in-out infinite}
.ai-link .lnk-node.m4 text{fill:var(--ai-strong)}
.ai-link .lnk-wire{stroke:var(--line-hot);stroke-width:1.4;stroke-dasharray:3 4}
.ai-link .lnk-pkt{fill:var(--ai-strong);animation:lnk-travel 1.9s linear infinite}
.ai-link .lnk-pkt.p2{animation-delay:.63s}
.ai-link .lnk-pkt.p3{animation-delay:1.26s}
@keyframes lnk-travel{
  0%{transform:translateX(0);opacity:0}
  12%{opacity:1}
  88%{opacity:1}
  100%{transform:translateX(164px);opacity:0}
}
@keyframes lnk-work{
  0%,100%{stroke-width:1.2;filter:none}
  50%{stroke-width:2.2;filter:drop-shadow(0 0 4px var(--ai))}
}

.thumb-ai-elapsed{
  margin-left:auto;color:var(--ai-strong);font-weight:700;
  border:1px solid var(--ai-line);padding:1px 6px;
}
.thumb-ai-elapsed.slow{color:var(--wait-strong);border-color:var(--wait)}

/* Respeto por quien pide menos movimiento en el sistema. */
@media (prefers-reduced-motion: reduce){
  .ai-robot *,.ai-dots i,.nx-led,.ai-link *{animation:none!important}
  .ai-link .lnk-pkt{opacity:1}
}

/* ---------- Fila de preajustes de DTE ---------- */
.nx-preset-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:stretch}
.nx-preset-friday{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  border-color:var(--spark);color:var(--spark);white-space:nowrap;
}
.nx-preset-friday:hover{background:var(--spark-soft);border-color:var(--spark)}
.nx-preset-friday .nx-preset-main{font-weight:700;letter-spacing:.4px}
.nx-preset-friday small{color:var(--faint);font-size:9.5px;font-family:var(--mono);letter-spacing:.2px}
@media (max-width:520px){.nx-preset-row{grid-template-columns:1fr}}

/* Subtítulo y sello del enlace privado en la animación de análisis */
.ai-thinking-sub{font-size:11.5px;color:var(--muted);margin:-2px 0 7px}
.ai-thinking-secure{color:var(--ai);letter-spacing:.3px}


/* =====================================================================
   ANALIZADOR DE ACTIVOS — componentes propios
   Se añaden al final para no tocar el diseño heredado: mismas variables,
   mismas esquinas rectas, misma paleta carbón.
   ===================================================================== */

/* ------------------------------------------------- entradas con sufijo */
.nx-suffix-input{
  display:flex;align-items:center;gap:0;
  border:1px solid var(--line-hot);background:var(--panel-2);
}
.nx-suffix-input input{
  flex:1;min-width:0;border:0;background:transparent;color:var(--text);
  font-family:var(--mono);font-size:15px;padding:9px 10px;
}
.nx-suffix-input input:focus{outline:none}
.nx-suffix-input span{
  padding:0 10px;color:var(--muted);font-size:12px;letter-spacing:.06em;
  text-transform:uppercase;border-left:1px solid var(--line);align-self:stretch;
  display:flex;align-items:center;
}
.nx-suffix-input.compact{max-width:110px}
.nx-suffix-input:focus-within{border-color:var(--accent)}

.nx-risk-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.nx-horizon-row{display:flex;align-items:center;gap:12px}
.nx-horizon-row .dte-range-slider{flex:1}

.nx-hint{display:block;margin:6px 0 12px;color:var(--faint);font-size:12px;line-height:1.5}
.nx-hint code{
  font-family:var(--mono);background:var(--panel-2);
  border:1px solid var(--line);padding:1px 4px;color:var(--accent);
}

/* --------------------------------------------- vista previa del riesgo */
.nx-risk-preview{
  margin-top:12px;padding:10px 12px;
  background:var(--accent-soft);border:1px solid var(--line);
}
.nx-risk-line{
  display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  padding:3px 0;font-size:13px;
}
.nx-risk-line span{color:var(--muted)}
.nx-risk-line b{font-family:var(--mono);font-size:14px}
.nx-risk-preview small{display:block;margin-top:6px;font-size:11.5px;line-height:1.5}

/* ------------------------------------------------------- casilla simple */
.nx-checkbox{
  display:flex;align-items:center;gap:9px;margin-top:14px;
  font-size:13px;color:var(--muted);cursor:pointer;
}
.nx-checkbox input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer}

/* ------------------------------------------------- filtro por clase */
.nx-class-filter{display:grid;gap:7px;margin-bottom:14px}
.class-choice{
  display:flex;align-items:center;gap:9px;padding:8px 10px;cursor:pointer;
  border:1px solid var(--line);background:var(--panel-2);
  font-size:12.5px;letter-spacing:.03em;transition:border-color .15s,background .15s;
}
.class-choice:hover{border-color:var(--line-hot)}
.class-choice input{accent-color:var(--accent);cursor:pointer}
.class-choice span{display:flex;justify-content:space-between;flex:1;color:var(--muted)}
.class-choice b{font-family:var(--mono);color:var(--faint);font-size:11.5px}
.class-choice:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.class-choice:has(input:checked) span{color:var(--text)}
.class-choice.accion:has(input:checked){border-color:var(--spark)}
.class-choice.etf:has(input:checked){border-color:var(--call)}
.class-choice.commodity:has(input:checked){border-color:var(--wait)}

/* ------------------------------------------------- régimen de mercado */
.nx-regime{margin-bottom:18px}
.nx-regime-badge{
  font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;
  padding:4px 10px;border:1px solid var(--line-hot);color:var(--muted);white-space:nowrap;
}
.nx-regime-badge.good{color:var(--call-strong);border-color:var(--call);background:var(--call-soft)}
.nx-regime-badge.mid{color:var(--wait-strong);border-color:var(--wait);background:var(--wait-soft)}
.nx-regime-badge.bad{color:var(--put-strong);border-color:var(--put);background:var(--put-soft)}

.nx-regime-guidance{
  margin:10px 0 14px;font-size:13.5px;line-height:1.6;color:var(--text);
  border-left:2px solid var(--accent);padding-left:11px;
}
.nx-regime-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:8px;margin-bottom:14px;
}
.nx-regime-pillar{
  display:grid;gap:2px;padding:8px 10px;
  background:var(--panel-2);border:1px solid var(--line);
}
.nx-regime-sym{font-family:var(--mono);font-size:12px;color:var(--accent);letter-spacing:.04em}
.nx-regime-name{font-size:11.5px;color:var(--faint);line-height:1.3}
.nx-regime-chg{font-family:var(--mono);font-size:14px;margin-top:3px}
.nx-regime-chg small{margin-left:5px;font-size:10px;color:var(--faint)}
.nx-regime-ma{font-size:10.5px;letter-spacing:.05em;text-transform:uppercase}
.nx-regime-ma.good{color:var(--call)}
.nx-regime-ma.bad{color:var(--put)}

.nx-regime-body h4{
  margin:16px 0 8px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);font-weight:600;
}
.nx-regime-body h4 small{text-transform:none;letter-spacing:0;margin-left:8px;font-size:11px}
.nx-regime-reasons{margin:0;padding-left:18px;display:grid;gap:5px}
.nx-regime-reasons li{font-size:12.5px;color:var(--muted);line-height:1.55}
.nx-regime-reasons li b{color:var(--text)}

.nx-rotation-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:7px}
.nx-rotation-row{
  display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:4px 10px;
  padding:7px 10px;background:var(--panel-2);border:1px solid var(--line);
}
.nx-rotation-row span{font-size:12.5px;color:var(--text)}
.nx-rotation-row b{font-family:var(--mono);font-size:13.5px}
.nx-rotation-row small{grid-column:1/-1;font-size:11px;color:var(--faint)}

/* ------------------------------------------------- ajustes de la AI */
.ai-badge{
  font-family:var(--mono);font-size:11px;letter-spacing:.07em;text-transform:uppercase;
  padding:3px 9px;border:1px solid var(--spark);color:var(--spark);background:var(--spark-soft);
}

@media (max-width: 720px){
  .nx-risk-fields{grid-template-columns:1fr}
  .nx-regime-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
}
