/* ---------- tema.css · rediseño v1.40 · paleta A (grafito, lima y cian) ----------
   Se carga DESPUES de app.css y lo corrige: app.css quedó con muchos parches verdes (neón, brillos, degradados). Reglas de color:
   · lima = solo el boton principal y el menu activo (la marca)
   · cian = lo seleccionado, los enlaces y las barras de progreso (segundo color)
   · verde / rojo = SOLO ganancia y perdida
   · fondo grafito, tarjetas planas con borde fino, sin brillos */

:root{--fondo:#fff;--tarjeta:#f3f3f5;--linea:#e6e6e8;--ac2:#0b7fc0;--ok:#1f9d63;--ko:#d63b3b;--aviso:#b97700}
html[data-tema="oscuro"]{--fondo:#0d1117;--tarjeta:#151b23;--linea:#242d38;--ac2:#38bdf8;--ok:#3ddc97;--ko:#ff6b6b;--aviso:#f5a524;
  --txt:#e6edf3;--txt2:#8b98a8;--borde:#242d38;--gris:#151b23;--blanco:#0d1117;--negro:#0a0e14;--verde:#3ddc97;--rojo:#ff6b6b}
html[data-tema="oscuro"] body{background:#080b10}
html[data-tema="oscuro"] .app{background:var(--fondo)}
.fondo-neon{display:none !important}
.pos-t,.cambio.pos,td.tend.pos{color:var(--ok)}
.neg-t,.cambio.neg,td.tend.neg{color:var(--ko)}

/* ---------- barra de arriba y marca de agua ---------- */
html[data-tema="oscuro"] .barra-cuenta{background:var(--negro);border-bottom:1px solid var(--linea)}
.barra-cuenta .bc-der{color:var(--txt)}
.barra-cuenta .punto.ok{background:var(--ok);box-shadow:none}
.punto.ok{animation:none}
html[data-tema="oscuro"] .punto.ok{background:var(--ok)}
.marca-agua b{text-shadow:none;color:rgba(144,222,22,.55)}

/* ---------- menu lateral ---------- */
html[data-tema="oscuro"] .sb{background:var(--tarjeta);border-right:1px solid var(--linea)}
html[data-tema="oscuro"] .item:hover{background:rgba(255,255,255,.05);color:#fff}
html[data-tema="oscuro"] .item.on,html[data-tema="oscuro"] .item.abierto{background:rgba(144,222,22,.08);color:#fff;box-shadow:inset 3px 0 0 var(--lima)}
html[data-tema="oscuro"] .item.on svg,html[data-tema="oscuro"] .item.abierto svg{stroke:var(--lima);filter:none}
.item[data-n]:not([data-n=""])::after{background:var(--ac2);color:#06222f}
.menu-sep{display:none}
html[data-tema="oscuro"] .estado{background:var(--fondo);border:1px solid var(--linea)}
.btn-oscuro,.estado .btn-oscuro{background:transparent;color:var(--txt);border:1px solid var(--linea);font-weight:500}
.btn-oscuro:hover{border-color:var(--ac2);color:var(--ac2)}
body.sb-ancho .sb .logo{margin:2px 0 8px}
body.sb-ancho .sb .logo img.completo{max-width:104px;margin:0 auto}          /* el logo apilado se veia enorme al abrir el menu */
.mas-pop{position:fixed;z-index:80;min-width:216px;background:var(--tarjeta);color:var(--txt);border:1px solid var(--linea);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.45);padding:8px}
.mas-t{font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--txt2);padding:8px 10px 4px}
.mas-i{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;color:var(--txt);cursor:pointer;text-decoration:none;font-size:14px}
.mas-i svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--txt2);flex:none}
.mas-i:hover{background:rgba(128,128,128,.14)}
.mas-i.on{background:rgba(56,189,248,.12);color:var(--ac2)}.mas-i.on svg{color:var(--ac2)}
@media (min-width:761px){.mas-i[data-vista="Ajustes"]{display:none}}

/* ---------- paginas: encabezado compacto en vez del banner verde grande ---------- */
.centro{gap:12px}
.hero,html:not([data-tema="oscuro"]) .hero{position:static;overflow:visible;min-height:0;padding:0 0 2px;border:0;border-radius:0;background:none;box-shadow:none;gap:12px;align-items:center}
.hero::before,.hero::after{display:none}
.hero-ic{width:34px;height:34px;border-radius:10px;background:var(--tarjeta);border:1px solid var(--linea);box-shadow:none}
.hero-ic svg{width:18px;height:18px;stroke:var(--txt2)}
.hero-t{min-width:0;flex:1}
.hero-t .resumen-h,.resumen-h{margin:0;padding:0;font-size:20px;font-weight:600;letter-spacing:-.01em;text-shadow:none}
.resumen-h::after{display:none}
.hero-s{font-size:13px;margin-top:1px;color:var(--txt2);max-width:none}
.hero-chip{font-size:11px;font-weight:600;padding:3px 10px;letter-spacing:.03em}
.hero-chip.demo{color:var(--txt2);border-color:var(--linea);background:transparent}
body.cuenta-real .hero-chip.demo{color:#ff8a8a;border-color:rgba(224,49,49,.6);background:rgba(224,49,49,.12)}
.banda,html[data-tema="oscuro"] .banda{background:var(--tarjeta) !important;color:var(--txt);border:1px solid var(--linea);border-radius:12px;padding:10px 14px;box-shadow:none}
.banda::after{display:none}
.banda .t{font-size:13px;font-weight:600;margin:0;color:var(--txt)}
.banda .s{font-size:12.5px;color:var(--txt2);margin-top:2px;line-height:1.5}
.banda .lima{color:var(--ac2)}
details.mas summary{color:var(--ac2);font-weight:500;font-size:12.5px}

/* ---------- tarjetas, cifras y tablas: planas, con borde fino ---------- */
html[data-tema="oscuro"] .tarjeta,html[data-tema="oscuro"] .kpi,html[data-tema="oscuro"] .estr-t,html[data-tema="oscuro"] details.tarjeta.plegable{background:var(--tarjeta);border:1px solid var(--linea);border-top:1px solid var(--linea);box-shadow:none}
html[data-tema="oscuro"] .tarjeta:hover,html[data-tema="oscuro"] .kpi:hover,html[data-tema="oscuro"] .estr-t:hover{transform:none;box-shadow:none;border-color:var(--linea)}
.tarjeta,.kpi{border-radius:12px}
.kpi{padding:12px 16px}
.kpi .v{font-size:26px;font-weight:600;letter-spacing:-.01em}
html[data-tema="oscuro"] .kpi .v{text-shadow:none}
.kpi.lima,html[data-tema="oscuro"] .kpi.lima{background:var(--tarjeta);border:1px solid var(--linea);border-top:2px solid var(--lima);animation:none;color:var(--txt)}
.kpi.lima .v{color:var(--txt);text-shadow:none}.kpi.lima .sub{color:var(--txt2)}
html[data-tema="oscuro"] .tbl thead th{font-weight:600;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--txt2);border-bottom:1px solid var(--linea)}
.tbl tbody tr:hover{background:rgba(128,128,128,.07)}
table.tbl tr.clic:hover{background:rgba(56,189,248,.08)}
table.tbl tr.sel{background:rgba(56,189,248,.12)}
.tabla-scroll thead th{background:var(--tarjeta)}
.insignia.hecho{background:rgba(61,220,151,.14);color:var(--ok)}
html[data-tema="oscuro"] .insignia.hecho{background:rgba(61,220,151,.14);color:var(--ok)}
.insignia.sin-ventaja{background:rgba(255,107,107,.14);color:var(--ko)}
.insignia.no-evaluable{background:rgba(56,189,248,.12);color:var(--ac2)}
.veredicto.bien,html[data-tema="oscuro"] .veredicto.bien{background:rgba(61,220,151,.14);color:var(--ok)}
.veredicto.mal,html[data-tema="oscuro"] .veredicto.mal{background:rgba(255,107,107,.14);color:var(--ko)}
.veredicto.neutro,html[data-tema="oscuro"] .veredicto.neutro{background:rgba(128,128,128,.16);color:var(--txt2)}
.aviso-evento{background:rgba(245,165,36,.13);color:var(--aviso)}
.aviso{background:rgba(56,189,248,.12);color:var(--ac2)}
.enlace,html[data-tema="oscuro"] .enlace{color:var(--ac2)}
.barra-prog,html[data-tema="oscuro"] .barra-prog{background:var(--linea)}
.barra-prog i,.barra-rel,.mes-b{background:var(--ac2)}
.demo-tag{background:rgba(56,189,248,.12);color:var(--ac2)}
.notif{border-left-color:var(--ac2)}
.notif.compra{border-left-color:var(--ok)}.notif.venta{border-left-color:var(--ko)}
.notif-ej{background:rgba(56,189,248,.14);color:var(--ac2);border:1px solid rgba(56,189,248,.35)}
.tab.on{border-bottom-color:var(--ac2)}
html[data-tema="oscuro"] .der .fila.on,html[data-tema="oscuro"] .fila.on{background:rgba(56,189,248,.1)}
.sel-item.on{background:rgba(56,189,248,.12)}
.tk,html:not([data-tema="oscuro"]) .tk{background:var(--tarjeta);border:1px solid var(--linea);border-radius:10px}
.tk:hover{border-color:var(--ac2);box-shadow:none;transform:none}

/* ---------- botones, filtros y pestañas ---------- */
.pill,html[data-tema="oscuro"] .pill{background:var(--lima);color:#0d1117;border:0;font-weight:600}
.pill:hover{box-shadow:none;transform:none;filter:brightness(1.07)}
.pill.peq,html[data-tema="oscuro"] .pill.peq{background:transparent;color:var(--txt);border:1px solid var(--linea);font-weight:500}
.pill.peq:hover,html[data-tema="oscuro"] .pill.peq:hover{border-color:var(--ac2);color:var(--ac2);filter:none}
.pill.peq.hecho,html[data-tema="oscuro"] .pill.peq.hecho{background:rgba(61,220,151,.12);color:var(--ok);border-color:rgba(61,220,151,.4)}
.chips{flex-wrap:wrap}
.chip.on,html[data-tema="oscuro"] .chip.on{background:rgba(56,189,248,.1);border-color:var(--ac2);box-shadow:none;color:var(--ac2)}
.pestanas button.on,html[data-tema="oscuro"] .pestanas button.on{background:rgba(56,189,248,.1);border-color:var(--ac2);color:var(--ac2)}
.pestanas button,html[data-tema="oscuro"] .pestanas button{font-weight:500}
.pill-check input{accent-color:var(--ac2)}
.interruptor input:checked+span,html[data-tema="oscuro"] .interruptor input:checked+span{background:var(--ac2)}
.bc-btn.reanudar{background:var(--lima);color:#0d1117}
.volver{color:var(--ac2);font-weight:600;cursor:pointer;text-decoration:none;padding:4px 10px 4px 0;white-space:nowrap}
.volver:hover{text-decoration:underline}
.det-nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* ---------- barras de ganadas / perdidas (Estrategias, Resultados) ---------- */
.gp-barra{display:flex;height:6px;border-radius:3px;overflow:hidden;background:var(--linea)}
.gp-barra i{display:block;height:100%}
.gp-barra i.g{background:var(--ok)}.gp-barra i.p{background:var(--ko)}
.res-filtros,.est-barra,.sen-filtros,.sen-barra{display:flex;align-items:center;justify-content:space-between;gap:10px 14px;flex-wrap:wrap}
.sen-filtros{justify-content:flex-start}
.res-sel{display:inline-flex;align-items:center;gap:8px}
.sen-vivo{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--txt2)}.sen-vivo b{color:var(--txt);letter-spacing:.04em}
.sen-vivo .punto{margin:0}
.sen-acc{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.sen-lista{display:flex;flex-direction:column;gap:10px}

/* ---------- Estrategias: una fila por estrategia ---------- */
.est-lista{display:flex;flex-direction:column;gap:6px}
.est-fila{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.7fr) 72px 98px 46px 16px;gap:14px;align-items:center;background:var(--tarjeta);border:1px solid var(--linea);border-radius:10px;padding:10px 14px;cursor:pointer;transition:border-color .15s,background .15s}
.est-fila:hover,.est-fila:focus-visible{border-color:var(--ac2);outline:none}
.ef-n{display:flex;flex-direction:column;min-width:0}.ef-n b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ef-n .sub{font-size:12px}
.ef-leg{margin-top:4px;font-size:12px}
.ef-r{display:flex;flex-direction:column;align-items:flex-end}.ef-r b{font-size:16px}.ef-r span{font-size:12px}
.ef-v{display:flex;flex-direction:column;gap:3px;align-items:flex-start}.ef-v .sub{font-size:11px}
.ef-sw{justify-self:center}.ef-sw.pausada{opacity:.5}
.ef-fl{color:var(--txt2);font-style:normal;font-size:22px;line-height:1;text-align:right}
.est-nota{line-height:1.5}
@media (max-width:900px){
  .est-fila{grid-template-columns:minmax(0,1fr) auto 46px 14px;grid-template-areas:"n r sw fl" "b b b b" "v v v v";gap:8px 12px}
  .ef-n{grid-area:n}.ef-r{grid-area:r}.ef-sw{grid-area:sw}.ef-fl{grid-area:fl}.ef-b{grid-area:b}.ef-v{grid-area:v;flex-direction:row;align-items:center;gap:8px}
}

/* ---------- senales: tarjetas planas ---------- */
.senal{background:var(--tarjeta);border:1px solid var(--linea);border-left:3px solid var(--linea);border-radius:12px;margin-bottom:0}
.tarjeta .senal{background:var(--fondo)}
.senal.largo{border-left-color:var(--ok)}.senal.corto{border-left-color:var(--ko)}
.accion.largo{background:var(--ok);color:#06241a}.accion.corto{background:var(--ko);color:#2b0a0a}

/* ---------- pequeños ajustes de lectura ---------- */
td.num,th.num{white-space:nowrap}
#vista-demo table.tbl td:first-child,#vista-resultados table.tbl td:first-child{white-space:nowrap}
select{border:1px solid var(--linea);border-radius:8px;padding:5px 8px;font:inherit;font-size:13px}
html[data-tema="oscuro"] .item.abierto:not(.on){background:rgba(255,255,255,.06);box-shadow:none}
html[data-tema="oscuro"] .item.abierto:not(.on) svg{stroke:#fff}
.cargando{background:var(--ac2);color:#06222f}

/* ---------- grafico: limpio, con barra superior propia (titulo a la izquierda; «Capas» y el ticket a la derecha) ---------- */
#vista-grafico{padding:8px 10px;gap:6px}
#vista-grafico .barra{display:none}          /* sus controles (fecha, fuente, capas) viven ahora en la ventana «Capas» */
html[data-tema="oscuro"] .tarjeta.grafico,#vista-grafico .tarjeta.grafico{padding:0;border-radius:12px;overflow:hidden}
.lienzo-caja,.lienzo-caja.oscuro{border-radius:12px}
.lienzo-caja.oscuro,html[data-tema="oscuro"] .lienzo-caja.oscuro{background:#0a0d12}
.marca-grafico .fn-mundo{opacity:.07;filter:none}
.marca-grafico .fn-toro{opacity:.06;filter:none}
html[data-tema="oscuro"] .der{background:var(--tarjeta);border-left:1px solid var(--linea)}
.herr button.on{background:var(--ac2);color:#06222f;border-color:var(--ac2)}
.herr button.op{background:rgba(21,27,35,.82);color:#dcdcdc;border-color:rgba(255,255,255,.12)}
.lienzo-caja>#tfs .chip.on,.lienzo-caja:not(.oscuro)>#tfs .chip.on{background:rgba(56,189,248,.2);color:var(--ac2);box-shadow:none}
.panel-flota{background:rgba(16,21,28,.97);border-color:#242d38}
.graf-titulo{position:absolute;left:56px;top:10px;z-index:4;display:flex;align-items:baseline;gap:10px;pointer-events:none;white-space:nowrap}
.graf-titulo b{font-size:15px;letter-spacing:.02em;color:#e6edf3}
.graf-titulo span{font-size:12px;color:#8b98a8}
.graf-titulo #gt-px{font-size:15px;font-weight:600;color:#e6edf3;font-variant-numeric:tabular-nums}
.graf-titulo small{font-size:12px;font-weight:600}
.lienzo-caja:not(.oscuro) .graf-titulo b,.lienzo-caja:not(.oscuro) .graf-titulo #gt-px{color:#222}
.lienzo-caja .tip{top:36px;left:56px}
.graf-sup{position:absolute;right:84px;top:8px;z-index:8;display:flex;align-items:flex-start;gap:8px}
.capas-btn{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:8px;border:1px solid #242d38;background:rgba(21,27,35,.94);color:#e6edf3;font:inherit;font-size:12px;font-weight:600;cursor:pointer;box-shadow:0 4px 18px rgba(0,0,0,.3)}
.capas-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.capas-btn em{font-style:normal;background:var(--ac2);color:#06222f;border-radius:999px;font-size:10px;font-weight:700;padding:1px 6px}
.capas-btn em:empty{display:none}
.capas-btn:hover,.capas-btn.on{border-color:var(--ac2);color:var(--ac2)}
.lienzo-caja:not(.oscuro) .capas-btn{background:rgba(255,255,255,.96);color:#222;border-color:#d8d8dc}
.capas-pop,.o-det{position:absolute;top:calc(100% + 8px);right:0;width:300px;z-index:9;color:#e6edf3}
.capas-sub{padding:8px 14px 0;font-size:12px;color:#8b98a8;line-height:1.45}
.capas-pop .acciones,#vista-grafico .capas-pop .acciones{display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:8px;padding:12px 14px 14px}
#vista-grafico .capas-pop .acciones>label.sub{display:block !important;font-size:12px;color:#8b98a8;margin-bottom:-4px}
#vista-grafico .capas-pop .acciones input[type=date]{width:100%;min-height:32px;border-radius:8px;background:#0d1117;color:#e6edf3;border:1px solid #2a3340}
#vista-grafico .capas-pop .acciones .pill-check{width:100%;justify-content:flex-start;border-radius:8px;padding:7px 10px;background:transparent;border:1px solid #242d38;color:#e6edf3}
#vista-grafico .capas-pop .acciones .pill-check select{margin-left:auto;background:#0d1117;color:#e6edf3;border:1px solid #2a3340;border-radius:6px;padding:3px 6px;font-size:12px}
.orden.ticket{position:relative;right:auto;top:auto;width:auto;max-height:none;overflow:visible;background:transparent;border:0;box-shadow:none;backdrop-filter:none}
.tk-fila{display:flex;align-items:stretch;height:34px;border-radius:8px;overflow:hidden;box-shadow:0 4px 18px rgba(0,0,0,.3)}
.tk-fila .o-v,.tk-fila .o-c{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;height:34px;min-width:100px;padding:0 12px;border-radius:0;font-size:9.5px;font-weight:700;letter-spacing:.07em;line-height:1.05;color:#06150e}
.tk-fila .o-v{background:var(--ko)}.tk-fila .o-c{background:var(--ok)}
.tk-fila .o-v b,.tk-fila .o-c b{font-size:14px;font-weight:700;letter-spacing:0;font-variant-numeric:tabular-nums}
.tk-fila .o-v span,.tk-fila .o-c span{opacity:.85}
.tk-spread{display:grid;place-items:center;min-width:44px;padding:0 6px;background:#1a212b;color:#cfd8e3;font-size:11px;font-variant-numeric:tabular-nums}
.tk-det{display:flex;align-items:center;gap:6px;padding:0 10px;border:0;border-left:1px solid #2a3340;background:#151b23;color:#cfd8e3;font:inherit;font-size:11px;font-weight:600;cursor:pointer}
.tk-det svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.tk-det em{font-style:normal}
.tk-det:hover,.tk-det.on{color:var(--ac2)}
.orden.ticket .o-conf{position:absolute;inset:auto;top:calc(100% + 8px);right:0;width:280px;padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:12px;box-shadow:0 18px 50px rgba(0,0,0,.55);background:#10151c;z-index:10}
.o-det .o-res b.neg-t,.o-conf .neg-t{color:var(--ko)}.o-det .o-res b.pos-t,.o-conf .pos-t{color:var(--ok)}
.o-conf-t.c{color:var(--ok)}.o-conf-t.v{color:var(--ko)}
.o-conf-b button.o-c{background:var(--ok);color:#06150e}.o-conf-b button.o-v{background:var(--ko);color:#06150e}
body.rol-lectura .orden{display:none !important}
@media (max-width:760px){.graf-sup{right:8px;top:40px}.graf-titulo{left:8px}.lienzo-caja .tip{top:84px;left:8px}.capas-pop,.o-det{width:min(300px,calc(100vw - 32px))}}

/* ---------- celular: el menu vuelve abajo (un parche viejo del estilo neón lo había dejado arriba) ---------- */
@media (max-width:760px){
  .sb{position:fixed}
  html[data-tema="oscuro"] .sb{border-right:0;border-top:1px solid var(--linea)}
  .hero-chips{display:none}
  .est-fila{padding:10px 12px}
}

/* ---------- grafico en pantallas medianas: el titulo cede sitio a «Capas» y al ticket ---------- */
@media (max-width:1100px){.graf-titulo small{display:none}}
@media (max-width:960px) and (min-width:761px){.graf-titulo #gt-tf{display:none}}

/* ---------- Barra de arriba: dos cuentas ---------- */
.barra-cuenta{height:36px;cursor:default}.barra-cuenta .bc-izq{display:flex;align-items:center;gap:8px;min-width:0}
.bc-cuenta{display:flex;align-items:center;gap:7px;padding:3px 12px;border:1px solid var(--linea);border-radius:999px;background:var(--tarjeta);color:var(--txt);cursor:pointer;font-size:12.5px;white-space:nowrap}
.bc-cuenta:hover{border-color:var(--ac2)}.bc-cuenta b{letter-spacing:.06em;font-size:11px}.bc-cuenta .punto{margin-right:0}.bc-sub{color:var(--txt2)}.bc-saldo{font-weight:600}
.bc-cuenta.real{border-color:#a8342b}.bc-cuenta.real b{color:#ff8a7a}.barra-cuenta .punto.aviso{background:#e3b341}.barra-cuenta .punto.error{background:#f0603c}
.barra-cuenta .bc-der{display:flex;align-items:center;gap:6px;color:var(--txt)}.barra-cuenta .bc-btn{margin-left:0}
@media (max-width:1100px){.bc-sub{display:none}}@media (max-width:900px){.barra-cuenta .bc-btn.peligro{display:none}.bc-cuenta{padding:3px 9px}}.barra-cuenta{overflow:visible}
/* ---------- Fase 3: barra de riesgo, mapa de calor, campana de notificaciones ---------- */
.riesgo-barra{position:relative;height:12px;border-radius:6px;background:var(--linea);overflow:hidden}
.riesgo-barra i{display:block;height:100%;border-radius:6px;background:var(--ac2)}
.riesgo-barra i.ambar{background:#e3b341}.riesgo-barra i.rojo{background:var(--mal,#f0603c)}
.riesgo-barra s{position:absolute;top:0;bottom:0;width:1px;background:var(--txt2);opacity:.45}
.calor-fila{display:flex;align-items:center;gap:10px;margin:6px 0}.calor-fila>.sub{width:34px;flex:none}
.calor-grid{display:grid;gap:3px;flex:1}.calor-grid.h{grid-template-columns:repeat(12,minmax(0,1fr))}.calor-grid.d{grid-template-columns:repeat(7,minmax(0,1fr))}
.calor-c{border-radius:5px;padding:4px 2px;text-align:center;font-size:11px;line-height:1.25;background:var(--tarjeta);border:1px solid var(--linea);min-height:34px}
.calor-c b{display:block;font-weight:600;color:var(--txt)}.calor-c span{color:var(--txt2)}.calor-c.vacia{opacity:.45}
.bc-btn.campana{position:relative;padding:2px 8px}.bc-n{position:absolute;top:-5px;right:-4px;min-width:16px;height:16px;border-radius:8px;background:var(--lima);color:#0d1117;font-size:10px;font-weight:700;line-height:16px;text-align:center}
.centro-notifs{position:fixed;top:34px;right:12px;width:min(380px,calc(100vw - 24px));max-height:70vh;overflow:auto;z-index:60;background:var(--tarjeta);border:1px solid var(--linea);border-radius:10px;padding:10px;box-shadow:0 10px 30px rgba(0,0,0,.45)}
.centro-notifs[hidden]{display:none}.cn-cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.cn-it{display:flex;gap:8px;padding:7px 4px;border-top:1px solid var(--linea);font-size:13px}.cn-it.nueva{background:rgba(77,163,255,.08)}
.cn-i{width:18px;flex:none;text-align:center}.cn-it.gana .cn-i{color:var(--ok)}.cn-it.pierde .cn-i{color:var(--mal,#f0603c)}.cn-it.senal .cn-i{color:var(--lima)}