/* ══════════ FINANZAS — tema claro, al estilo del agregador que sustituye ══════════ */
.fin{
  --fin-azul:#2F6FED; --fin-rojo:#EF4D6D; --fin-verde:#17B26A; --fin-oro:#B8860B;
  --fin-texto:#1E2A44; --fin-tenue:#8A93A6; --fin-borde:#E7EBF2;
  --fin-fondo:#FFFFFF; --fin-panel:#F6F8FC;
  background:var(--fin-fondo); border-radius:var(--radio); padding:14px 12px 18px; margin:0 -4px;
  color:var(--fin-texto); position:relative;
  border:1px solid var(--fin-borde);
  font-family:'Bricolage Grotesque',sans-serif;
}
.fin-subnav{display:flex; gap:6px; margin-bottom:14px; background:var(--fin-panel); border-radius:999px; padding:4px}
.fin-subnav button{
  font-family:inherit; font-size:.72rem; font-weight:600; letter-spacing:.01em;
  padding:8px 6px; border-radius:999px; border:none;
  background:transparent; color:var(--fin-tenue); cursor:pointer; flex:1; text-align:center;
}
.fin-subnav button.on{background:var(--fin-fondo); color:var(--fin-texto); box-shadow:0 1px 4px rgba(30,42,68,.12)}

/* ── Selector de año + franja de los 12 meses ── */
.fin-anio-selector{display:flex; align-items:center; justify-content:center; gap:16px; margin:2px 0 10px}
.fin-anio-selector button{
  width:30px; height:30px; border-radius:9px; background:var(--fin-panel); border:none;
  color:var(--fin-texto); font-size:1rem; cursor:pointer; flex-shrink:0;
}
.fin-anio-selector button:disabled{opacity:.3; cursor:default}
.fin-anio-selector b{font-size:.95rem; letter-spacing:.02em; color:var(--fin-texto)}

.fin-meses-tira{display:flex; align-items:flex-end; gap:3px; margin:4px 0 16px; padding:4px 2px; overflow-x:auto}
.fin-mes-barra{
  flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; cursor:pointer;
  background:none; border:none; padding:4px 0 6px; min-width:22px; border-radius:8px;
}
.fin-mes-barra.on{background:var(--fin-panel)}
.fin-mes-barra .neto{font-size:.56rem; font-weight:700; height:12px; white-space:nowrap; color:var(--fin-tenue)}
.fin-mes-barra .neto.pos{color:var(--fin-verde)}
.fin-mes-barra .neto.neg{color:var(--fin-rojo)}
.fin-mes-barra .pista{height:150px; display:flex; align-items:flex-end; gap:2px}
.fin-mes-barra .pista i{display:block; width:7px; border-radius:3px 3px 0 0; background:var(--fin-borde)}
.fin-mes-barra .pista i.ingreso{background:var(--fin-azul)}
.fin-mes-barra .pista i.gasto{background:var(--fin-rojo)}
.fin-mes-barra span:last-child{font-size:.62rem; color:var(--fin-tenue); text-transform:lowercase}
.fin-mes-barra.on span:last-child{color:var(--fin-texto); font-weight:700}

.fin-grafico-filtro{
  display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px;
  font-size:.72rem; font-weight:600; color:var(--fin-texto);
}
/* La línea de estado del filtro de mes, pegada bajo la franja de meses. */
.fin-mes-filtro{margin:-8px 2px 14px; font-weight:500; color:var(--fin-tenue)}
.fin-grafico-filtro button{
  font-size:.66rem; font-weight:600; background:var(--fin-panel); border:none; border-radius:999px;
  color:var(--fin-tenue); padding:5px 10px; cursor:pointer; flex-shrink:0;
}

/* ── Ingresos / Gastos / Neto, en fila con punto de color ── */
.fin-resumen-filas{margin-bottom:16px}
.fin-resumen-fila{display:flex; align-items:center; gap:8px; padding:9px 2px; border-bottom:1px solid var(--fin-borde)}
.fin-resumen-fila:last-child{border-bottom:none}
.fin-resumen-fila .punto{width:9px; height:9px; border-radius:50%; flex-shrink:0}
.fin-resumen-fila .punto.ingreso{background:var(--fin-azul)}
.fin-resumen-fila .punto.gasto{background:var(--fin-rojo)}
.fin-resumen-fila .punto.neto{background:var(--fin-tenue)}
.fin-resumen-fila .nombre{flex:1; font-size:.92rem}
.fin-resumen-fila b{font-size:.98rem; font-weight:700}
.fin-resumen-fila.neg b{color:var(--fin-rojo)}

.fin-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:16px}
.fin-card{background:var(--fin-panel); border:1px solid var(--fin-borde); border-radius:12px; padding:12px 10px; text-align:center}
.fin-card b{font-weight:700; font-size:1.1rem; display:block; line-height:1.15}
.fin-card span{font-size:.62rem; letter-spacing:.04em; text-transform:uppercase; color:var(--fin-tenue); display:block; margin-top:4px}
.fin-card.ingreso b{color:var(--fin-azul)}
.fin-card.gasto b{color:var(--fin-rojo)}
.fin-card.ahorro b{color:var(--fin-verde)}
.fin-card.ahorro.neg b{color:var(--fin-rojo)}

.fin-card-total{margin-bottom:12px; padding:16px 10px}
.fin-card-total b{font-size:1.7rem; color:var(--fin-texto)}

.fin-donut-envoltura{display:flex; align-items:center; gap:16px; margin-bottom:16px}
.fin-donut{width:100px; height:100px; flex-shrink:0}
.fin-donut circle{transition:stroke-dasharray .3s}
.fin-donut-leyenda{display:flex; flex-direction:column; gap:5px; font-size:.72rem; color:var(--fin-tenue)}
.fin-donut-leyenda i{display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:6px}
.fin-donut-leyenda b{color:var(--fin-texto); font-weight:600; margin-left:4px}

.fin-pl-vivienda .fin-resumen-fila{gap:10px}
.fin-pl-vivienda .fin-pl-detalle{flex:1; font-size:.68rem; color:var(--fin-tenue); text-align:right}

.fin-nota-hipoteca{padding:0 2px 8px 30px; margin:0}

/* ── Pastilla Ingresos/Gastos/No computable ── */
.fin-pill-toggle{display:flex; gap:4px; background:var(--fin-panel); border-radius:999px; padding:4px; margin-bottom:16px}
.fin-pill-toggle button{
  flex:1; font-family:inherit; font-size:.72rem; font-weight:600; padding:8px 4px; border-radius:999px;
  border:none; background:transparent; color:var(--fin-tenue); cursor:pointer;
}
.fin-pill-toggle button.on{background:var(--fin-fondo); color:var(--fin-texto); box-shadow:0 1px 4px rgba(30,42,68,.12)}

.fin-cat{padding:10px 2px; border-bottom:1px solid var(--fin-borde); cursor:pointer}
.fin-cat-top{display:flex; align-items:center; gap:10px}
.fin-cat .punto-cat{width:11px; height:11px; border-radius:50%; flex-shrink:0}
.fin-cat .info{flex:1; min-width:0}
.fin-cat .info b{display:block; font-weight:600; font-size:.88rem}
.fin-cat .info span{font-size:.66rem; color:var(--fin-tenue)}
.fin-cat .imp{font-weight:700; font-size:.85rem; flex-shrink:0}
.fin-cat-detalle{padding:4px 2px 6px 30px}
.fin-mov{display:flex; align-items:center; gap:8px; padding:8px 2px; border-bottom:1px solid var(--fin-borde)}
.fin-mov:last-child{border-bottom:0}
.fin-mov .fecha{font-size:.68rem; color:var(--fin-tenue); width:44px; flex-shrink:0}
.fin-mov .txt{flex:1; min-width:0; font-size:.82rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:flex; align-items:baseline}
.fin-concepto-input{
  flex:1; min-width:0; font-size:.82rem; font-family:inherit; color:var(--fin-texto);
  background:transparent; border:none; border-radius:4px; padding:2px 3px; margin:-2px -3px;
}
.fin-concepto-input:hover, .fin-concepto-input:focus{background:var(--fin-panel); outline:none}
.fin-viaje-tag{font-style:normal; color:var(--fin-azul); font-size:.66rem}
.fin-viaje-enlace{
  background:none; border:none; padding:0; margin-left:4px; cursor:pointer;
  font-family:inherit; text-decoration:underline; text-underline-offset:2px;
}
.fin-viaje-enlace:hover{opacity:.8}
.fin-mov-viaje{
  display:flex; align-items:center; gap:6px; padding:0 2px 8px 52px; font-size:.68rem; color:var(--fin-tenue);
}
.fin-mov-viaje select{
  font-size:.68rem; background:var(--fin-panel); color:var(--fin-texto); border:1px solid var(--fin-borde);
  border-radius:6px; padding:3px 6px; flex:1; max-width:200px;
}
.fin-mov select.fin-catsel{
  font-size:.68rem; background:var(--fin-panel); color:var(--fin-texto);
  border:1px solid var(--fin-borde); border-radius:6px; padding:4px 3px; max-width:104px; flex-shrink:0;
}
.fin-btn-nocomputable{
  font-size:.78rem; line-height:1; background:var(--fin-panel); border:1px solid var(--fin-tenue);
  border-radius:6px; padding:4px 6px; flex-shrink:0; opacity:.75; cursor:pointer;
}
.fin-btn-nocomputable:hover{opacity:1; border-color:var(--fin-rojo)}
.fin-btn-nocomputable.on{opacity:1; border-color:var(--fin-rojo); background:rgba(239,77,109,.12)}
/* Mismo aspecto que el de no computable, junto al que vive en la fila —
   antes era un enlace de texto debajo, que se veía tarde y ocupaba una
   línea entera para un gesto tan pequeño. */
.fin-btn-dividir{
  font-size:.78rem; line-height:1; background:var(--fin-panel); border:1px solid var(--fin-tenue);
  border-radius:6px; padding:4px 6px; flex-shrink:0; opacity:.75; cursor:pointer;
}
.fin-btn-dividir:hover{opacity:1; border-color:var(--fin-azul)}
/* Los puentes v61: la etiqueta del neteo y los paneles de vincular/netear. */
.fin-tag-neteo{ color:var(--fin-verde, #58C08A); margin-left:4px }
.fin-panel-puente input{
  flex:1; min-width:110px; font-size:.72rem; padding:4px 8px;
  background:var(--fin-panel); color:var(--fin-texto);
  border:1px solid var(--fin-borde); border-radius:6px;
}
.fin-panel-puente button{
  flex-shrink:0; font-size:.68rem; font-weight:700; cursor:pointer; padding:4px 10px;
  background:var(--fin-azul); color:#fff; border:1px solid var(--fin-azul); border-radius:6px;
}
.fin-panel-puente button:last-child{ background:var(--fin-panel); color:var(--fin-texto); border-color:var(--fin-borde) }
.fin-panel-puente button:disabled{ opacity:.5; cursor:default }
.fin-panel-puente select{ max-width:none }
.fin-btn-borrar{
  font-size:.78rem; line-height:1; background:var(--fin-panel); border:1px solid var(--fin-tenue);
  border-radius:6px; padding:4px 6px; flex-shrink:0; opacity:.5; cursor:pointer;
}
.fin-btn-borrar:hover{opacity:1; border-color:var(--fin-rojo)}
/* El buscador de movimientos y el alta manual. */
.fin-mov-herramientas{display:flex; gap:8px; margin-bottom:10px}
.fin-mov-busca{
  flex:1; min-width:0; font-size:.8rem; padding:7px 10px;
  background:var(--fin-panel); color:var(--fin-texto);
  border:1px solid var(--fin-borde); border-radius:8px;
}
.fin-mov-busca::placeholder{color:var(--fin-tenue)}
.fin-btn-alta{
  flex-shrink:0; font-size:.72rem; font-weight:600; padding:7px 11px; cursor:pointer;
  background:var(--fin-panel); color:var(--fin-texto); border:1px solid var(--fin-borde); border-radius:8px;
}
.fin-btn-alta:hover{border-color:var(--fin-azul)}
.fin-alta-mov{
  background:var(--fin-panel); border:1px solid var(--fin-borde); border-radius:10px;
  padding:12px; margin-bottom:12px; font-size:.8rem;
}
.fin-alta-mov b{font-size:.78rem}
.fin-alta-mov i{font-style:normal; font-size:.66rem; color:var(--fin-tenue)}
.fin-alta-fila{display:flex; gap:8px; margin-top:8px; flex-wrap:wrap}
.fin-alta-fila input,.fin-alta-fila select{
  flex:1; min-width:110px; font-size:.78rem; padding:6px 8px;
  background:rgba(0,0,0,.2); color:var(--fin-texto); border:1px solid var(--fin-borde); border-radius:7px;
}
.fin-alta-fila button{
  flex-shrink:0; font-size:.74rem; font-weight:700; padding:6px 14px; cursor:pointer;
  background:var(--fin-azul); color:#fff; border:1px solid var(--fin-azul); border-radius:7px;
}
.fin-alta-fila button:disabled{opacity:.55; cursor:wait}
.fin-mov .imp{font-weight:700; font-size:.8rem; width:64px; text-align:right; flex-shrink:0}
.fin-mov .imp.neg{color:var(--fin-rojo)}
.fin-mov .imp.pos{color:var(--fin-azul)}
.fin-subcat-resumen{display:flex; flex-wrap:wrap; gap:6px; padding:2px 2px 10px 30px}
.fin-subcat-chip{
  font-size:.68rem; color:var(--fin-tenue); background:var(--fin-panel); border:1px solid var(--fin-borde);
  border-radius:20px; padding:4px 10px; white-space:nowrap;
}
.fin-subcat-chip b{color:var(--fin-texto); font-weight:600; margin-left:2px}
.fin .vacio{background:var(--fin-panel); border-color:var(--fin-borde); color:var(--fin-tenue)}
.fin-nota{font-size:.72rem; color:var(--fin-tenue); line-height:1.6; padding:10px 2px 2px}
.fin-error{font-size:.78rem; color:var(--fin-rojo); background:rgba(239,77,109,.08); border:1px solid rgba(239,77,109,.25); border-radius:8px; padding:8px 10px; margin:0 0 10px}

/* ── Dividir un movimiento en varias categorías (esquema v36) ── */
.fin-catsel-dividido{
  font-size:.64rem; background:var(--fin-panel); color:var(--fin-texto); text-align:left;
  border:1px solid var(--fin-borde); border-radius:6px; padding:4px 6px; max-width:104px; flex-shrink:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:pointer;
}
.fin-division{
  padding:8px 10px; margin:0 2px 10px 52px; background:var(--fin-panel);
  border:1px solid var(--fin-borde); border-radius:10px;
}
.fin-division-fila{display:flex; align-items:center; gap:6px; margin-bottom:6px}
.fin-division-fila select{
  flex:1; min-width:0; font-size:.76rem; background:var(--fin-fondo); color:var(--fin-texto);
  border:1px solid var(--fin-borde); border-radius:6px; padding:5px 6px;
}
.fin-division-importe{
  width:64px; flex-shrink:0; font-size:.76rem; text-align:right; background:var(--fin-fondo); color:var(--fin-texto);
  border:1px solid var(--fin-borde); border-radius:6px; padding:5px 6px;
}
.fin-division-eur{font-size:.7rem; color:var(--fin-tenue); flex-shrink:0}
.fin-division-quitar{
  background:none; border:none; color:var(--fin-tenue); font-size:1rem; line-height:1; cursor:pointer; flex-shrink:0; padding:2px 4px;
}
.fin-division-pie{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:2px}
.fin-division-suma{font-size:.7rem; font-weight:600; color:var(--fin-tenue)}
.fin-division-suma.mal{color:var(--fin-rojo)}
.fin-division-btns{display:flex; gap:8px; margin-top:8px}
.fin-division-btns button{
  font-weight:600; font-size:.74rem; padding:8px 12px; border-radius:8px; border:1px solid var(--fin-borde);
  background:var(--fin-fondo); color:var(--fin-texto); cursor:pointer;
}
.fin-division-btns button:first-child{background:var(--fin-azul); color:#fff; border-color:var(--fin-azul)}
.fin-division-btns button:disabled{opacity:.5; cursor:default}

/* ── El cerrojo ── */
.fin-candado{display:flex; align-items:center; justify-content:center; min-height:320px}
.fin-candado-caja{max-width:320px; text-align:center; margin:0 auto}
.fin-candado-ico{font-size:2.2rem; display:block; margin-bottom:8px}
.fin-candado-caja h3{font-size:1.05rem; margin:0 0 10px}
.fin-candado-caja form{display:flex; flex-direction:column; gap:8px; margin-top:12px}
.fin-candado-caja input{
  font-size:.9rem; background:var(--fin-panel); color:var(--fin-texto);
  border:1px solid var(--fin-borde); border-radius:9px; padding:10px 12px; text-align:center;
}
.fin-candado-caja button{
  font-weight:700; font-size:.78rem; padding:10px; border-radius:9px; border:none;
  background:var(--fin-azul); color:#fff; cursor:pointer;
}
.fin-candado-caja button:disabled{opacity:.5}

/* ── Patrimonio / Inversiones ── */
.fin-seccion{margin-top:18px; padding-top:14px; border-top:1px solid var(--fin-borde)}
.fin-seccion h3{font-size:.94rem; margin:0 0 10px; font-weight:700}
.fin-subtitulo{font-size:.68rem; letter-spacing:.04em; text-transform:uppercase; color:var(--fin-tenue); margin:10px 0 4px}
.fin-cuenta,.fin-inversion{background:var(--fin-panel); border:1px solid var(--fin-borde); border-radius:12px; padding:10px 12px; margin-bottom:8px}
.fin-cuenta-cab,.fin-inversion{display:flex; align-items:center; gap:10px}
.fin-cuenta-cab > div:first-child, .fin-inversion > div:first-child{flex:1; min-width:0; display:flex; flex-direction:column}
.fin-cuenta-cab b, .fin-inversion b{font-size:.85rem}
.fin-cuenta-cab span, .fin-inversion span{font-size:.66rem; color:var(--fin-tenue); margin-top:2px}
.fin-cuenta-saldo{text-align:right; display:flex; flex-direction:column; flex-shrink:0}
.fin-cuenta-saldo b{font-weight:700; font-size:.85rem}
.fin-cuenta-saldo span{font-size:.62rem; color:var(--fin-tenue)}
.fin-cuenta .borrar,.fin-inversion .borrar{
  background:none; border:none; color:var(--fin-tenue); font-size:1.1rem; line-height:1; cursor:pointer; flex-shrink:0; padding:2px 4px;
}
.fin-link{
  display:inline-block; background:none; border:none; color:var(--fin-azul); font-weight:600;
  font-size:.74rem; cursor:pointer; padding:6px 2px;
}
/* Cuentas archivadas: plegadas y en un tono apagado — siguen ahí, pero ya
 * no forman parte del día a día ni del total. */
.fin-archivadas{margin-top:10px}
.fin-archivadas summary{font-size:.74rem; font-weight:600; color:var(--fin-tenue); cursor:pointer; padding:4px 2px; list-style-position:inside}
.fin-archivadas .fin-cuenta{opacity:.65; margin-top:8px}
.fin-mini-form{display:flex; flex-direction:column; gap:6px; margin-top:8px}
.fin-mini-form input,.fin-mini-form select{
  font-size:.82rem; background:var(--fin-fondo); color:var(--fin-texto);
  border:1px solid var(--fin-borde); border-radius:8px; padding:8px 10px; width:100%;
}
.fin-mini-form button{
  font-weight:600; font-size:.74rem; padding:9px; border-radius:8px; border:1px solid var(--fin-borde);
  background:var(--fin-fondo); color:var(--fin-texto); cursor:pointer;
}
.fin-mini-form button[type="submit"]{background:var(--fin-azul); color:#fff; border-color:var(--fin-azul)}
.fin-mini-form button:disabled{opacity:.5}
.fin-resultado-busqueda{
  display:flex; flex-direction:column; align-items:flex-start; gap:2px; text-align:left;
  background:var(--fin-fondo); border:1px solid var(--fin-borde); border-radius:8px; padding:8px 10px; cursor:pointer;
}
.fin-resultado-busqueda b{font-size:.82rem}
.fin-resultado-busqueda span{font-size:.66rem; color:var(--fin-tenue)}

/* ── Importar ── */
.fin-importar .fin-btn-archivo{
  display:block; text-align:center; font-size:.76rem;
  background:var(--fin-panel); border:1.5px dashed var(--fin-borde); border-radius:9px; color:var(--fin-azul); padding:12px; margin-bottom:14px; cursor:pointer;
}
.fin-importar .fin-btn-archivo input{display:none}
.fin-nombre-cuenta{
  display:block; width:100%; font-size:.82rem; background:var(--fin-fondo); color:var(--fin-texto);
  border:1px solid var(--fin-borde); border-radius:8px; padding:8px 10px; margin-bottom:8px;
}

/* ── Inversiones: tabla de posiciones ── */
.fin-inv-tabla-envoltura{overflow-x:auto; margin-bottom:6px}
.fin-inv-tabla{width:100%; border-collapse:collapse; font-size:.74rem; white-space:nowrap}
.fin-inv-tabla th{
  text-align:right; font-size:.6rem; letter-spacing:.03em; text-transform:uppercase; color:var(--fin-tenue);
  padding:6px 8px; border-bottom:1px solid var(--fin-borde); font-weight:600;
}
.fin-inv-tabla th:first-child,.fin-inv-tabla td:first-child{text-align:left}
.fin-inv-tabla td{padding:8px; text-align:right; border-bottom:1px solid var(--fin-borde)}
.fin-inv-tabla td.pos{color:var(--fin-azul)}
.fin-inv-tabla td.neg{color:var(--fin-rojo)}

/* ── Gráfico de barras (evolución / B-P mensual) ── */
.fin-grafico{margin:10px 0 4px}
.fin-grafico-barras{display:flex; align-items:flex-end; gap:6px; height:130px; padding:0 2px}
.fin-grafico-barras .col{flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; min-width:0}
.fin-grafico-barras .col .neto{font-size:.56rem; font-weight:700; white-space:nowrap}
.fin-grafico-barras .col .neto.pos{color:var(--fin-verde)}
.fin-grafico-barras .col .neto.neg{color:var(--fin-rojo)}
.fin-grafico-barras .col .pista{width:100%; display:flex; align-items:flex-end; justify-content:center; height:90px}
.fin-grafico-barras .col .pista i{display:block; width:60%; border-radius:3px 3px 0 0}
.fin-grafico-barras .col .pista i.pos{background:var(--fin-verde)}
.fin-grafico-barras .col .pista i.neg{background:var(--fin-rojo); border-radius:0 0 3px 3px; align-self:flex-start}
.fin-grafico-barras .col span:last-child{font-size:.6rem; color:var(--fin-tenue)}
/* La línea de Evolución del B/P (v62). */
.fin-evo svg{width:100%; height:auto; display:block; touch-action:pan-y}
.fin-evo-guia{stroke:var(--fin-tenue); stroke-width:1; stroke-dasharray:2 2; vector-effect:non-scaling-stroke}
.fin-evo-cero{stroke:var(--fin-borde); stroke-width:1; stroke-dasharray:3 3}
.fin-evo-linea{fill:none; stroke-width:2; stroke-linejoin:round; stroke-linecap:round; vector-effect:non-scaling-stroke}
.fin-evo-linea.pos, .fin-evo-punto.pos{stroke:var(--fin-azul)}
.fin-evo-punto.pos{fill:var(--fin-azul)}
.fin-evo-linea.neg, .fin-evo-punto.neg{stroke:var(--fin-rojo)}
.fin-evo-punto.neg{fill:var(--fin-rojo)}
.fin-evo-pie{
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  font-family:'IBM Plex Mono',monospace; font-size:.64rem; color:var(--fin-tenue); margin-top:4px;
}
.fin-evo-pie b{font-size:.9rem}
.fin-evo-pie b.pos{color:var(--fin-azul)}
.fin-evo-pie b.neg{color:var(--fin-rojo)}
.fin-rango-toggle{display:flex; gap:4px; justify-content:flex-end; margin-bottom:6px}
.fin-rango-toggle button{
  font-size:.66rem; font-weight:600; padding:5px 10px; border-radius:999px; border:1px solid var(--fin-borde);
  background:var(--fin-fondo); color:var(--fin-tenue); cursor:pointer;
}
.fin-rango-toggle button.on{background:var(--fin-texto); color:#fff; border-color:var(--fin-texto)}

/* ── Analítica de inversiones (v63): líneas, leyendas, contribuidores, años ── */
.fin-evo-linea.azul{stroke:var(--fin-azul)}
.fin-evo-punto.azul{fill:var(--fin-azul); stroke:var(--fin-azul)}
.fin-evo-linea.oro{stroke:var(--fin-oro); stroke-width:2.5}
.fin-evo-punto.oro{fill:var(--fin-oro); stroke:var(--fin-oro)}
.fin-evo-linea.tenue{stroke:var(--fin-tenue)}
.fin-evo-linea.roja{stroke:var(--fin-rojo); stroke-width:1.8}
.fin-evo-linea.invisible{stroke:none}
.fin-evo-linea.discont{stroke-dasharray:5 4}
.fin-banda-oro{fill:#F3E2B3; opacity:.55}
.fin-banda-azul{fill:#DCEAFB; opacity:.7}
.fin-banda-roja{fill:#FDEBEF}
.fin-card.oro b{color:var(--fin-oro)}
.fin-cards-inv{grid-template-columns:repeat(2,1fr)}
@media (min-width:700px){.fin-cards-inv{grid-template-columns:repeat(4,1fr)}}
.fin-dd-cards{grid-template-columns:repeat(3,1fr); margin-bottom:10px}
.fin-leyenda{display:flex; flex-wrap:wrap; gap:5px 14px; font-size:.64rem; color:var(--fin-tenue); margin-top:6px}
.fin-leyenda i{display:inline-block; vertical-align:middle; margin-right:5px}
.fin-leyenda i.linea{width:14px; height:0; border-top:2.5px solid; border-radius:2px}
.fin-leyenda i.linea.azul{border-color:var(--fin-azul)}
.fin-leyenda i.linea.oro{border-color:var(--fin-oro)}
.fin-leyenda i.linea.tenue{border-color:var(--fin-tenue)}
.fin-leyenda i.linea.discont{border-top-style:dashed}
.fin-leyenda i.banda{width:14px; height:8px; border-radius:2px}
.fin-leyenda i.banda.oro{background:#F3E2B3}
.fin-leyenda i.banda.azul{background:#DCEAFB}
.fin-contrib{display:flex; flex-direction:column; gap:7px; margin-top:8px}
.fin-contrib .fila{display:grid; grid-template-columns:minmax(88px,118px) 1fr 76px; gap:8px; align-items:center; font-size:.72rem}
.fin-contrib .nombre{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600}
.fin-contrib .pista{position:relative; height:13px; background:var(--fin-panel); border-radius:6px; overflow:hidden}
.fin-contrib .pista i{position:absolute; top:0; bottom:0; border-radius:6px}
.fin-contrib .pista i.p{left:28%; background:var(--fin-azul)}
.fin-contrib .pista i.n{right:72%; background:var(--fin-rojo)}
.fin-contrib .pista i.eje{left:28%; width:1px; background:var(--fin-borde); border-radius:0}
.fin-contrib .imp{font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:.68rem; text-align:right}
.fin-contrib .imp.pos{color:var(--fin-azul)}
.fin-contrib .imp.neg{color:var(--fin-rojo)}
.fin-contrib .puntos{color:var(--fin-tenue); text-align:center; letter-spacing:.2em}
.fin-tabla-anios{width:100%; border-collapse:collapse; font-size:.72rem; margin-top:6px}
.fin-tabla-anios th{font-size:.56rem; letter-spacing:.05em; text-transform:uppercase; color:var(--fin-tenue); font-weight:600; text-align:right; padding:4px 4px 6px}
.fin-tabla-anios th:first-child, .fin-tabla-anios td:first-child{text-align:left}
.fin-tabla-anios td{padding:6px 4px; border-top:1px solid var(--fin-borde); text-align:right; font-family:'IBM Plex Mono',monospace; font-variant-numeric:tabular-nums; white-space:nowrap}
.fin-tabla-anios td:first-child{font-family:'Bricolage Grotesque',sans-serif; font-weight:700}
.fin-tabla-anios td.pos{color:var(--fin-azul)}
.fin-tabla-anios td.neg{color:var(--fin-rojo)}
.fin-chip{font-size:.54rem; font-weight:700; padding:2px 6px; border-radius:999px; margin-left:4px; font-family:'Bricolage Grotesque',sans-serif}
.fin-chip.mejor{background:#E4F7EE; color:var(--fin-verde)}
.fin-chip.peor{background:#FDEBEF; color:var(--fin-rojo)}
/* La tabla de posiciones, resumida en el móvil: las columnas .esc (símbolo,
 * precio medio, precio actual) solo aparecen con sitio de escritorio. */
.fin-inv-tabla .esc{display:none}
@media (min-width:760px){.fin-inv-tabla .esc{display:table-cell}}