@font-face{font-family:"Geist";font-style:normal;font-weight:100 900;font-display:swap;src:url(/static/fonts/geist-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ═══════════════════════════════════════════════════════════════════
   Inversión Mensual · sistema "Terminal oscuro" (ver DISENO.md)
   Oscuro por defecto; claro con [data-theme="light"].
   Un único acento (ámbar). Verde/rojo solo con signo y flecha.
   ═══════════════════════════════════════════════════════════════════ */

/* ───────── Tokens: oscuro (por defecto) ───────── */
:root{
  color-scheme:dark;
  --bg:#0E1116; --surface:#171C24; --surface-2:#1E242E; --sunken:#11151B; --header:#0E1116;
  --ink:#E7EBF0; --ink-2:#B3BBC7; --ink-3:#8B95A5;
  --line:#3A4352; --hair:#262D38;
  --accent:#F2A93B; --accent-ink:#0E1116; --accent-text:#F2A93B; --accent-soft:#2A2314; --accent-line:#5C4519; --accent-edge:#F2A93B;
  --pos:#4ADE9A; --neg:#FF6B6B; --pos-soft:#12291F; --neg-soft:#2E1719;
  --field:#11151B; --field-line:#646E80;
  /* series de gráfico: c1 focal (ámbar); c3/c6 grises de referencia; c2/c4 apagados; c5 = caídas */
  --c1:#F2A93B; --c2:#7FA7C9; --c3:#B4BCC8; --c4:#5FB3A6; --c5:#FF6B6B; --c6:#7A8597;
  /* reparto de cartera (sin rojo ni verde para no confundir con subida/bajada) */
  --w1:#F2A93B; --w2:#7FA7C9; --w3:#B4BCC8; --w4:#5FB3A6; --w5:#6F7A8B; --w6:#C2AC86;
  --grid:#232A35; --zero:#4A5466;
  --foot-bg:#0A0D11; --foot-ink:#E7EBF0; --foot-ink-2:#9AA4B3; --foot-line:#232A35;
  --shadow-pop:0 12px 32px -12px rgba(0,0,0,.65);
  /* modo de la estrategia (sin verde ni rojo: esos son solo de rentabilidad) */
  --mode-on:#7FA7C9; --mode-on-soft:#142230; --mode-off:#F2A93B; --mode-off-soft:#2A2314;
  /* categorías de guía */
  --cat-1:#F2A93B; --cat-2:#7FA7C9; --cat-3:#B4BCC8; --cat-4:#5FB3A6; --cat-5:#C2AC86; --cat-6:#A596D6;
  /* profundidad: sombra con desplazamiento y desenfoque, tintada al fondo */
  --shadow-1:0 1px 2px rgba(3,6,10,.45),0 6px 16px -8px rgba(3,6,10,.6);
  --shadow-2:0 2px 4px rgba(3,6,10,.4),0 18px 36px -14px rgba(3,6,10,.75);
  --glow:radial-gradient(40% 90% at 62% 0%,rgba(242,169,59,.10),transparent 70%);
  --hair-hi:rgba(255,255,255,.05);
  /* escala de espaciado y de movimiento */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:72px;
  --dur-1:150ms; --dur-2:250ms; --dur-3:450ms; --dur-4:700ms;
  /* radios con jerarquía: control < panel < bloque destacado */
  --r-xs:3px; --r-sm:4px; --r-md:6px; --r-lg:10px; --r-xl:14px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --z-header:20; --z-bar:100;
  --font:"Geist",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono","Cascadia Mono","Roboto Mono","JetBrains Mono",Menlo,Consolas,"Liberation Mono",monospace;
}
/* ───────── Tokens: claro (elección del usuario) ───────── */
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#F4F5F7; --surface:#FFFFFF; --surface-2:#EDEFF2; --sunken:#F7F8FA; --header:#FFFFFF;
  --ink:#12161C; --ink-2:#39414C; --ink-3:#59636F;
  --line:#C3C9D2; --hair:#E0E3E8;
  --accent:#F2A93B; --accent-ink:#12161C; --accent-text:#94570A; --accent-soft:#FBEFD9; --accent-line:#E2B66A; --accent-edge:#B07A1E;
  --pos:#0B7A47; --neg:#C42E2E; --pos-soft:#E2F3EA; --neg-soft:#FBE7E7;
  --field:#FFFFFF; --field-line:#8B95A3;
  --c1:#B26D08; --c2:#3E6E99; --c3:#8A939F; --c4:#2D8579; --c5:#C42E2E; --c6:#6E7783;
  --w1:#E09A2D; --w2:#4F7FAA; --w3:#9AA3AE; --w4:#3E978B; --w5:#5F6977; --w6:#B39A70;
  --grid:#E6E9ED; --zero:#9AA3AE;
  --foot-bg:#E9ECF0; --foot-ink:#12161C; --foot-ink-2:#454E5A; --foot-line:#D3D8DF;
  --shadow-pop:0 12px 32px -14px rgba(18,22,28,.28);
  --mode-on:#2F6490; --mode-on-soft:#E4EEF7; --mode-off:#94570A; --mode-off-soft:#FBEFD9;
  --cat-1:#B26D08; --cat-2:#3E6E99; --cat-3:#6E7783; --cat-4:#2D8579; --cat-5:#8C7448; --cat-6:#6A58B0;
  --shadow-1:0 1px 2px rgba(18,22,28,.08),0 6px 16px -8px rgba(18,22,28,.18);
  --shadow-2:0 2px 4px rgba(18,22,28,.07),0 18px 36px -14px rgba(18,22,28,.26);
  --glow:radial-gradient(40% 90% at 62% 0%,rgba(242,169,59,.14),transparent 70%);
  --hair-hi:rgba(255,255,255,.7);
}

/* ───────── Base ───────── */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 var(--font);font-feature-settings:"calt","tnum" 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
::selection{background:color-mix(in srgb,var(--accent) 35%,transparent);color:var(--ink)}
img,svg{max-width:100%}
a{color:var(--accent-text);text-underline-offset:3px;text-decoration-thickness:1px;text-decoration-color:color-mix(in srgb,var(--accent-text) 45%,transparent);transition:text-decoration-color .2s var(--ease),color .2s var(--ease)}
a:hover{text-decoration-color:currentColor}
h1,h2,h3,h4{font-family:var(--font);line-height:1.2;margin:0 0 .5em;color:var(--ink);font-weight:650;text-wrap:balance}
h1{font-size:clamp(1.85rem,4.2vw,2.7rem);line-height:1.1;letter-spacing:-.025em;font-weight:700}
h2{font-size:clamp(1.35rem,2.4vw,1.7rem);margin-top:1.9em;letter-spacing:-.018em}
h3{font-size:1.1rem;margin-top:1.5em;letter-spacing:-.008em;font-weight:620}
h4{font-size:.95rem}
p{margin:0 0 1em;text-wrap:pretty}
b,strong{font-weight:620}
.container{width:100%;max-width:1160px;margin:0 auto;padding:0 20px}
.narrow{max-width:780px}
.muted{color:var(--ink-2)} .small{font-size:.875rem} .xs{font-size:.78rem}
.skip{position:absolute;left:-999px} .skip:focus{left:8px;top:8px;background:var(--surface);color:var(--ink);padding:8px 12px;z-index:var(--z-bar);border:1px solid var(--accent)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ───────── Cifras ─────────
   .num  → monoespaciada + cifras tabulares (cualquier cifra)
   .up / .pos  → subida: verde + flecha ▲ (el signo lo pone el formateador: spct / SM.spct)
   .down / .neg → bajada: rojo + flecha ▼
   .flat → sin cambio: gris + "="                                              */
.num,.mono{font-family:var(--mono);font-variant-numeric:tabular-nums lining-nums;letter-spacing:-.01em}
.num{white-space:nowrap}
.pos,.up{color:var(--pos)} .neg,.down{color:var(--neg)} .flat{color:var(--ink-3)}
.pos::before,.up::before{content:"▲\00a0";content:"▲\00a0" / "";font-size:.68em;vertical-align:.12em;font-family:var(--font)}
.neg::before,.down::before{content:"▼\00a0";content:"▼\00a0" / "";font-size:.68em;vertical-align:.12em;font-family:var(--font)}
.flat::before{content:"=\00a0";content:"=\00a0" / ""}
.no-arrow::before{content:none!important}

/* ───────── Cabecera: barra clásica compacta ───────── */
.site-header{position:sticky;top:0;z-index:var(--z-header);background:var(--header);border-bottom:1px solid var(--hair)}
.site-header .container{position:relative;display:flex;align-items:center;gap:14px;height:54px}
.brand{font-family:var(--mono);font-weight:700;font-size:.98rem;letter-spacing:-.01em;color:var(--ink);text-decoration:none;display:flex;align-items:center;gap:9px;white-space:nowrap}
.brand-mark{width:22px;height:22px;flex:none;color:var(--accent)}
.brand:hover{color:var(--ink)}
.nav{display:flex;gap:2px;margin-left:auto;align-items:center;height:100%}
.nav a{color:var(--ink-2);text-decoration:none;padding:0 10px;height:100%;display:flex;align-items:center;font-size:.875rem;font-weight:500;box-shadow:inset 0 -2px 0 transparent;transition:color .15s,box-shadow .15s}
.nav a:hover{color:var(--ink);box-shadow:inset 0 -2px 0 var(--line)}
.nav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}
/* hueco para el buscador de la cabecera (T-A11): <div class="site-search">…</div> entre .brand y .nav */
.site-search{flex:0 1 280px;min-width:0;margin-left:12px;position:relative}
.site-search input{min-height:34px;height:34px;padding:4px 10px 4px 30px;font-size:.85rem;border-radius:var(--r-sm);background:var(--field)}
.site-search kbd{position:absolute;right:8px;top:50%;transform:translateY(-50%)}
.site-search+.nav{margin-left:auto}
kbd{font:500 .72rem var(--mono);color:var(--ink-3);border:1px solid var(--line);border-bottom-width:2px;border-radius:var(--r-xs);padding:0 5px;background:var(--surface)}
.theme-toggle,.nav-toggle{flex:none;width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:var(--r-sm);background:transparent;color:var(--ink-2);cursor:pointer;padding:0}
.theme-toggle:hover,.nav-toggle:hover{color:var(--ink);border-color:var(--ink-3)}
.theme-toggle{visibility:hidden} html[data-theme] .theme-toggle{visibility:visible}
.theme-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .i-sun{display:none}
:root[data-theme="light"] .theme-toggle .i-sun{display:block} :root[data-theme="light"] .theme-toggle .i-moon{display:none}
.acct-link{flex:none;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 11px;border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink-2);font-size:.85rem;font-weight:500;text-decoration:none;position:relative;transition:color .15s,border-color .15s}
.acct-link:hover{color:var(--ink);border-color:var(--ink-3)}
.acct-link svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.acct-link.on{color:var(--ink)}
.acct-link.on::after{content:"";position:absolute;top:5px;right:5px;width:7px;height:7px;border-radius:50%;background:var(--mode-on);box-shadow:0 0 0 2px var(--bg)}
@media (max-width:640px){.acct-link{width:34px;padding:0;justify-content:center}.acct-link .lbl{display:none}
  .site-header .container{gap:8px}.brand{font-size:.88rem;gap:7px}.site-search{margin-left:0;min-width:44px}}
.nav-toggle{display:none;position:relative}
.nav-toggle i{position:absolute;left:9px;right:9px;height:1.5px;background:currentColor;top:50%;transition:transform .2s var(--ease)}
.nav-toggle i:first-of-type{transform:translateY(-3.5px)} .nav-toggle i:last-of-type{transform:translateY(3.5px)}
.nav-toggle[aria-expanded="true"] i:first-of-type{transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] i:last-of-type{transform:rotate(-45deg)}
@media (max-width:960px){
  .nav-toggle{display:grid;margin-left:auto}
  .site-search{flex:1 1 auto}
  .site-search~.nav-toggle{margin-left:0}
  .nav{position:absolute;left:0;right:0;top:100%;height:auto;flex-direction:column;align-items:stretch;gap:0;padding:6px 0;margin:0;
    background:var(--surface);border-bottom:1px solid var(--line);box-shadow:var(--shadow-pop);display:none}
  .nav.open{display:flex}
  .nav a{height:auto;padding:12px 20px;font-size:.98rem;box-shadow:inset 3px 0 0 transparent}
  .nav a:hover{box-shadow:inset 3px 0 0 var(--line);background:var(--surface-2)}
  .nav a[aria-current="page"]{box-shadow:inset 3px 0 0 var(--accent)}
}

/* ───────── Cabecera de página ───────── */
.hero{padding:40px 0 12px}
.hero p.lead{font-size:1.1rem;line-height:1.6;color:var(--ink-2);max-width:62ch}
.lead{color:var(--ink-2)}
/* .eyebrow: rótulo pequeño y discreto (sin píldora). Usar solo donde aporte. */
.eyebrow{display:block;font:500 .74rem/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px}
.breadcrumb{font:.78rem/1.5 var(--mono);color:var(--ink-3);padding-top:22px}
.breadcrumb a{color:var(--ink-3);text-decoration:none} .breadcrumb a:hover{color:var(--accent-text);text-decoration:underline}

/* ───────── Rejillas y paneles ───────── */
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
/* panel estándar: plano, borde fino, radio medio */
.card{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);padding:20px;position:relative}
.card h3,.card h2{margin-top:0}
.card h2{font-size:1.2rem}
a.card{display:block;color:inherit;text-decoration:none;transition:border-color .15s,background-color .15s}
a.card:hover{border-color:var(--line);background:var(--surface-2)}
a.card:hover :is(h2,h3){text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:4px;text-decoration-thickness:1px}
a.card:active{background:var(--surface-2)}
.card .tag,.tag{font:500 .7rem/1.4 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}
/* KPI / stat: rótulo mono, cifra mono grande, nota debajo */
.stat{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-sm);padding:12px 14px}
.stat .k{font:500 .7rem/1.4 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}
.stat .v{font-family:var(--mono);font-size:1.6rem;font-weight:600;letter-spacing:-.03em;line-height:1.2;margin-top:4px;font-variant-numeric:tabular-nums lining-nums;white-space:nowrap}
.stat .s{font-size:.78rem;color:var(--ink-3);margin-top:2px;font-variant-numeric:tabular-nums}
/* .kpi: la cifra protagonista de una vista (una por pantalla) */
.kpi{display:flex;flex-direction:column;gap:2px}
.kpi .k{font:500 .72rem/1.4 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}
.kpi .v{font:600 clamp(2.2rem,5vw,3.2rem)/1.05 var(--mono);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.kpi .s{font-size:.85rem;color:var(--ink-2)}
/* .kpi-strip: fila densa de cifras separadas por filetes (alternativa a la rejilla de tarjetas) */
.kpi-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));border:1px solid var(--hair);border-radius:var(--r-sm);background:var(--surface)}
.kpi-strip>*{padding:12px 14px;border-left:1px solid var(--hair)}
.kpi-strip>*:first-child{border-left:0}
.kpi-strip .stat{border:0;border-radius:0;border-left:1px solid var(--hair)}

/* ───────── Panel de señal ───────── */
.signal{--mode:var(--ink-3);background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);padding:20px 22px 18px;position:relative;display:flex;flex-direction:column;box-shadow:inset 0 2px 0 var(--mode),var(--shadow-1);transition:transform var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease),border-color var(--dur-2)}
.signal.on{--mode:var(--mode-on)}
.signal.off{--mode:var(--mode-off)}
.signal:hover{border-color:var(--line)}
.signal h2{font-weight:650;letter-spacing:-.015em}
.signal-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap}
.signal-id{min-width:0;flex:1 1 180px}
.signal-ret{display:flex;align-items:baseline;gap:8px;margin:2px 0 0;font-size:.86rem}
.signal-ret b{font-size:1.15rem;font-weight:600;letter-spacing:-.02em}
.signal-kicker{font:500 .7rem/1.4 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}
.signal-title{margin:2px 0 6px;font-size:1.2rem}
.signal-title.big{font-size:1.5rem}
.signal-title a{color:inherit;text-decoration:none}
.signal-title a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.signal-foot{margin:auto 0 0;padding-top:12px}
.badge{display:inline-flex;align-items:center;gap:4px;font:600 .68rem/1 var(--mono);padding:6px 8px;border-radius:var(--r-xs);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;border:1px solid transparent}
/* indicador de modo: punto de color + texto (nunca solo color). Ofensivo = azul · defensivo = ámbar · mixto = mitad y mitad */
.badge::before{content:"";width:7px;height:7px;border-radius:50%;flex:none;background:currentColor}
.badge.on{background:var(--mode-on-soft);color:var(--mode-on);border-color:color-mix(in srgb,var(--mode-on) 40%,transparent)}
.badge.off{background:var(--mode-off-soft);color:var(--mode-off);border-color:color-mix(in srgb,var(--mode-off) 45%,transparent)}
.badge.off::before{background:transparent;box-shadow:inset 0 0 0 1.6px currentColor}
.badge.mixed{background:var(--surface-2);color:var(--ink-2);border-color:var(--line)}
.badge.mixed::before{background:linear-gradient(90deg,var(--mode-on) 50%,var(--mode-off) 50%)}
.badge.neutral{background:var(--surface-2);color:var(--ink-2);border-color:var(--hair)}
.badge.neutral::before{width:8px;height:2px;border-radius:0}
/* barra de reparto: SVG con un <rect> por activo (sin estilos en línea) */
.wbar{display:block;width:100%;height:12px;margin:16px 0 14px;border-radius:3px;overflow:hidden;background:var(--sunken)}
div.wbar{display:flex;gap:2px}
div.wbar span{display:block;height:100%}
.wbar rect{stroke:var(--surface);stroke-width:2px;vector-effect:non-scaling-stroke}
.ser-1{fill:var(--w1);background:var(--w1)} .ser-2{fill:var(--w2);background:var(--w2)} .ser-3{fill:var(--w3);background:var(--w3)}
.ser-4{fill:var(--w4);background:var(--w4)} .ser-5{fill:var(--w5);background:var(--w5)} .ser-6{fill:var(--w6);background:var(--w6)}
.wrow{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--hair);font-size:.92rem}
.wrow:last-child{border-bottom:0}
.wrow .t{display:flex;gap:10px;align-items:baseline;min-width:0}
.wrow .num{white-space:nowrap}
.wrow b:first-child{font-family:var(--mono);font-weight:600;font-size:.88rem}
.sw{width:9px;height:9px;border-radius:1px;display:inline-block;flex:none}

/* ───────── Tablas ───────── */
.tablewrap{overflow-x:auto;border:1px solid var(--hair);border-radius:var(--r-md);background:var(--surface);-webkit-overflow-scrolling:touch;box-shadow:var(--shadow-1)}
/* tablas largas: scroll vertical dentro del contenedor para que la cabecera se quede fija */
.tablewrap.tall{max-height:min(640px,78vh);overflow:auto}
/* tablas más anchas que la pantalla: la primera columna se queda fija al desplazar */
.tablewrap td:first-child,.tablewrap th:first-child{position:sticky;left:0;z-index:1;background:var(--surface)}
.tablewrap th:first-child{background:var(--surface-2);z-index:2}
table{border-collapse:collapse;width:100%;font-size:.9rem}
th,td{padding:9px 14px;text-align:right;border-bottom:1px solid var(--hair);white-space:nowrap;font-variant-numeric:tabular-nums}
td{font-family:var(--mono);font-size:.86rem;letter-spacing:-.01em}
td:first-child,td.wrap{font-family:var(--font);font-size:.9rem;letter-spacing:0}
th:first-child,td:first-child{text-align:left}
th{font:600 .68rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3);background:var(--surface-2);position:sticky;top:0}
tbody tr:hover td{background:var(--surface-2)}
tr:last-child td{border-bottom:0}
td.wrap{white-space:normal;text-align:left;min-width:200px}
tr.sel td{background:var(--accent-soft)}
tr.sel td:first-child{box-shadow:inset 3px 0 0 var(--accent)}
td input{font-family:var(--mono);font-variant-numeric:tabular-nums;min-width:88px;min-height:36px;padding:6px 8px;text-align:right}
caption{caption-side:bottom;text-align:left;font-size:.78rem;color:var(--ink-3);padding:8px 14px}
/* .tbl-dense: tablas de datos tipo terminal */
.tbl-dense th,.tbl-dense td{padding:6px 10px}
.tbl-dense td{font-size:.82rem}
.tbl-dense tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--surface-2) 45%,var(--surface))}
.tbl-dense tbody tr{transition:background-color var(--dur-1)}
.tbl-dense tbody tr:hover td{background:var(--surface-2)}
.tbl-dense td a{text-decoration:none}
.tbl-dense td a:hover{text-decoration:underline}
@media (max-width:1100px){
  .tbl-dense td.wrap{min-width:150px}
  .tbl-dense th,.tbl-dense td{padding:6px 8px}
}
/* en móvil, .tbl-stack se convierte en una pila de tarjetas: cada fila una ficha, con la etiqueta de cada dato */
@media (max-width:640px){
  .tablewrap:has(.tbl-stack){border:0;background:transparent;overflow:visible;box-shadow:none;max-height:none}
  .tbl-stack,.tbl-stack tbody,.tbl-stack tr,.tbl-stack td{display:block;width:100%}
  .tbl-stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tbl-stack tr{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);padding:12px 14px;margin-bottom:10px;box-shadow:var(--shadow-1)}
  .tbl-stack td,.tbl-stack tbody tr:nth-child(even) td{display:flex;justify-content:space-between;align-items:baseline;gap:16px;text-align:right;border:0;padding:5px 0;background:transparent;white-space:normal;min-width:0}
  .tbl-stack td::before{content:attr(data-label);font:600 .66rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.04em;color:var(--ink-3);flex:none;text-align:left}
  .tbl-stack td.heat::before,.tbl-stack td.up::before,.tbl-stack td.down::before{content:attr(data-label)}
  .tbl-stack td:first-child{position:static;display:block;text-align:left;font-size:1rem;padding-bottom:8px;margin-bottom:4px;border-bottom:1px solid var(--hair)}
  .tbl-stack td:first-child::before{content:none}
  .tbl-stack td.wrap{min-width:0;text-align:right}
  .tbl-stack td:first-child.wrap{text-align:left}
}
/* tablas de calor (filtro heat de build.py): clases up/down + heat-1..5, sin estilos en línea.
   El fondo lleva la intensidad; la flecha ▲/▼ no depende solo del color. */
td.heat{color:var(--ink)}
td.heat.up{--h:var(--pos)}
td.heat.down{--h:var(--neg)}
td.heat.flat{--h:var(--zero)}
td.heat-1{background:color-mix(in srgb,var(--h) 8%,transparent)}
td.heat-2{background:color-mix(in srgb,var(--h) 16%,transparent)}
td.heat-3{background:color-mix(in srgb,var(--h) 24%,transparent)}
td.heat-4{background:color-mix(in srgb,var(--h) 32%,transparent)}
td.heat-5{background:color-mix(in srgb,var(--h) 40%,transparent)}
td.heat.up::before{content:"▲\00a0";content:"▲\00a0" / "";font-size:.66em;vertical-align:.14em;color:var(--pos);font-family:var(--font)}
td.heat.down::before{content:"▼\00a0";content:"▼\00a0" / "";font-size:.66em;vertical-align:.14em;color:var(--neg);font-family:var(--font)}

/* ───────── Botones y formularios ───────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--accent);color:var(--accent-ink);border:1px solid var(--accent-edge);border-radius:var(--r-sm);padding:10px 18px;min-height:42px;font:600 .92rem/1.2 var(--font);cursor:pointer;text-decoration:none;transition:background-color .15s,border-color .15s,color .15s}
.btn:hover{background:color-mix(in srgb,var(--accent) 86%,#fff)}
.btn:active{transform:translateY(1px)}
.btn .ico{display:inline-grid;place-items:center;width:16px;height:16px}
.btn .ico svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{background:var(--surface-2);border-color:var(--ink-3)}
.btn.sm{padding:6px 12px;min-height:34px;font-size:.85rem}
label{display:block;font-size:.8rem;font-weight:600;color:var(--ink-2);margin-bottom:6px}
input,select,textarea{width:100%;font:inherit;font-size:.95rem;color:var(--ink);background:var(--field);border:1px solid var(--field-line);border-radius:var(--r-sm);padding:8px 12px;min-height:42px;transition:border-color .15s,box-shadow .15s}
input[type="number"]{font-family:var(--mono);font-variant-numeric:tabular-nums}
input:hover,select:hover{border-color:var(--ink-3)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
input[type="checkbox"],input[type="radio"]{accent-color:var(--accent)}
button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-xs)}
.field{margin-bottom:14px}
.form-row{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.help{font-size:.78rem;color:var(--ink-3);margin-top:4px}
/* chips de filtro (checkbox dentro de label) */
.checks{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:7px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:5px 10px;min-height:34px;cursor:pointer;font-size:.85rem;font-weight:500;color:var(--ink-2);user-select:none;transition:border-color .15s,background-color .15s,color .15s}
.chip:hover{border-color:var(--ink-3);color:var(--ink)}
.chip input{width:auto;min-height:0;margin:0;padding:0;border:0;box-shadow:none}
.chip i{width:9px;height:9px;border-radius:1px;display:inline-block}
.chip:has(input:checked){background:var(--accent-soft);border-color:var(--accent-line);color:var(--ink)}
.chip:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
/* .chip como botón de filtro (sin checkbox): aria-pressed="true" = activo */
button.chip{font-family:var(--font)}
.chip[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent-line);color:var(--ink)}

/* ───────── Avisos ───────── */
.note{background:var(--surface);border:1px solid var(--hair);box-shadow:inset 0 2px 0 var(--ink-3);padding:14px 18px;border-radius:var(--r-sm);margin:22px 0;font-size:.94rem}
.note.warn{background:var(--accent-soft);border-color:var(--accent-line);box-shadow:inset 0 2px 0 var(--accent)}
.note.risk{background:var(--neg-soft);border-color:color-mix(in srgb,var(--neg) 35%,transparent);box-shadow:inset 0 2px 0 var(--neg)}
.disclaimer{font-size:.78rem;color:var(--ink-3);border-top:1px solid var(--hair);padding-top:14px;margin-top:40px;max-width:80ch}

/* ───────── Gráficos (estilo FT/Economist: una serie focal, resto en gris, anotaciones) ───────── */
.chart{position:relative;width:100%;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);padding:14px 10px 8px}
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.chart .ax{stroke:var(--line);stroke-width:1}
.chart .grid-l{stroke:var(--grid);stroke-width:1}
.chart .zero{stroke:var(--zero);stroke-width:1}
.chart text{fill:var(--ink-3);font:calc(11px * var(--k,1)) var(--mono);font-variant-numeric:tabular-nums}
.chart text.annot,.annot{fill:var(--ink);font:600 calc(11px * var(--k,1)) var(--mono)}
.chart text.annot-s{fill:var(--ink-3);font:calc(10.5px * var(--k,1)) var(--font)}
.chart .chart-empty{padding:12px;margin:0}
.chart .tip{position:absolute;pointer-events:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;font-size:.78rem;box-shadow:var(--shadow-pop);z-index:3;min-width:160px;display:none}
.chart .tip b{display:block;margin-bottom:4px;font:600 .74rem var(--mono);color:var(--ink-2);text-transform:uppercase;letter-spacing:.03em}
.chart .tip div{display:flex;justify-content:space-between;gap:14px;line-height:1.6}
.chart .tip .num{color:var(--ink)}
.legend{display:flex;flex-wrap:wrap;gap:4px 16px;margin:8px 6px 2px;font-size:.8rem;color:var(--ink-2)}
.legend i{display:inline-block;width:14px;height:2px;margin-right:6px;vertical-align:middle}
.legend span:first-child{color:var(--ink);font-weight:600}
.legend span:first-child i{height:3px}
/* .annot como texto HTML: nota breve junto a un gráfico o cifra */
p.annot,span.annot{font:500 .78rem/1.45 var(--mono);color:var(--ink-2)}

/* ───────── Texto largo ───────── */
.prose{font-size:1.0625rem;line-height:1.72}
.prose h2{margin-top:2em;font-size:clamp(1.35rem,2.4vw,1.6rem)} .prose h3{font-size:1.15rem}
.prose ul,.prose ol{padding-left:1.3em;margin:0 0 1.2em} .prose li{margin-bottom:.4em} .prose li::marker{color:var(--ink-3)}
.prose blockquote{margin:1.4em 0;padding:.2em 0 .2em 1.1em;border-left:1px solid var(--accent);color:var(--ink-2)}
.prose table{margin:1.2em 0;font-size:.9rem}
.prose td{font-family:var(--font);font-size:.92rem;letter-spacing:0}
.prose :not(.tablewrap)>table{display:block;overflow-x:auto;border:1px solid var(--hair);border-radius:var(--r-md);background:var(--surface)}
.prose code{font-family:var(--mono);background:var(--surface-2);padding:1px 6px;border-radius:var(--r-xs);font-size:.86em}
.prose>p:first-of-type,.prose>.lead{font-size:1.12rem;color:var(--ink-2)}
.prose hr{border:0;border-top:1px solid var(--hair);margin:2em 0}
.meta{font:.8rem/1.5 var(--mono);color:var(--ink-3);margin-bottom:24px}
.toc{background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-sm);padding:14px 18px;margin:22px 0;font-size:.9rem}
.toc ol{margin:6px 0 0;padding-left:1.3em}

/* ───────── Publicidad: espacio reservado (CLS) ───────── */
/* .ad-slot: hueco reutilizable con altura reservada (sin CLS) y etiqueta «Publicidad». Distinto a propósito de las tarjetas:
   sin superficie ni enlaces, rotulado, y siempre separado de botones, tablas y herramientas por un espacio generoso. */
body[data-ads-client]:not(.ads-on) .ad-slot{display:none}
.ad-slot{display:block;margin:var(--s-7) auto;max-width:100%;text-align:center;overflow:hidden;position:relative;clear:both}
.ad-label{display:block;font:500 .64rem/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px}
.ad-h{min-height:132px}
.ad-in{min-height:318px}
.ad-side{min-height:638px;margin:0}
@media (max-width:760px){.ad-h{min-height:318px}}
.ad-slot .adsbygoogle{min-height:inherit}
.ad-fill{display:grid;place-items:center;min-height:calc(100% - 20px);height:90px;border:1px dashed var(--line);border-radius:var(--r-sm);color:var(--ink-3);font:500 .74rem/1.4 var(--mono);letter-spacing:.02em;background:repeating-linear-gradient(135deg,transparent 0 10px,color-mix(in srgb,var(--ink-3) 7%,transparent) 10px 11px)}
.ad-h .ad-fill{height:100px}
.ad-in .ad-fill{height:280px}
.ad-side .ad-fill{height:600px}
@media (max-width:760px){.ad-h .ad-fill{height:250px}}
@media print{.ad-slot{display:none}}

/* ───────── Afiliados ───────── */
.aff{display:grid;gap:14px}
.aff .card{display:grid;gap:8px}
.sponsored{font:500 .68rem var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}
.aff-box{margin:32px 0;padding:16px 18px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--hair)}
.aff-box p{margin:8px 0 12px}
.aff-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline;flex-wrap:wrap}
.aff-row{display:flex;gap:8px;flex-wrap:wrap}

/* ───────── Pie y newsletter ───────── */
.footer-wrap{margin-top:96px;position:relative}
.nl-wrap{position:relative;margin-bottom:0}
.site-footer{background:var(--foot-bg);color:var(--foot-ink-2);padding:48px 0 28px;font-size:.9rem;border-top:1px solid var(--foot-line);margin-top:56px}
.site-footer h3{margin-top:0;font:600 .7rem/1.4 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--foot-ink);margin-bottom:12px}
.site-footer .small{color:var(--foot-ink-2)}
.site-footer ul{list-style:none;padding:0;margin:0} .site-footer li{margin-bottom:7px}
.site-footer a{color:var(--foot-ink-2);text-decoration:none} .site-footer a:hover{color:var(--foot-ink);text-decoration:underline}
.site-footer .grid{gap:28px}
.site-footer .mmw-row{margin:20px 0 0;text-align:center}
.site-footer .mmw-credit{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border:1px solid var(--foot-line);border-radius:999px;font-size:.82rem;color:var(--foot-ink-2);white-space:nowrap;transition:border-color .2s,color .2s}
.site-footer .mmw-credit b{font-weight:600;color:var(--foot-ink)}
.site-footer .mmw-credit:hover{color:var(--foot-ink);border-color:var(--foot-ink-2);text-decoration:none}
.site-footer .mmw-credit svg{flex:none;display:block}
.legal{margin-top:36px;padding-top:18px;border-top:1px solid var(--foot-line);font-size:.76rem;line-height:1.7;color:var(--foot-ink-2);max-width:110ch}
.newsletter{background:var(--surface);color:var(--ink);border:1px solid var(--hair);border-top:2px solid var(--accent);border-radius:var(--r-md);padding:26px 28px;display:grid;gap:20px 32px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));align-items:center}
.newsletter h2{color:var(--ink);margin:0 0 6px;font-size:clamp(1.2rem,2.2vw,1.45rem)} .newsletter p{margin:0;color:var(--ink-2)}
.newsletter a{color:inherit}
.newsletter form{display:flex;gap:8px;flex-wrap:wrap}
.newsletter input{flex:1 1 200px}
.nl-note{width:100%;margin:0;color:var(--ink-3)}
.newsletter .nl-consent{display:flex;gap:8px;align-items:flex-start;width:100%;line-height:1.45;color:var(--ink-2);font-weight:500;margin:4px 0 0}
.newsletter .nl-consent input{flex:0 0 auto;width:auto;min-height:0;margin-top:2px;padding:0}
.newsletter .nl-consent a{color:var(--accent-text)}

/* ───────── Diagramas de decisión (SVG; colores por clase para claro/oscuro) ───────── */
.diagram{margin:28px 0;padding:20px 14px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--hair)}
.diagram svg{width:100%;height:auto;display:block;max-width:420px;margin:0 auto}
.diagram figcaption{font-size:.84rem;color:var(--ink-3);margin-top:12px;text-align:center}
.dg-box{fill:var(--surface-2);stroke:var(--line);stroke-width:1.2}
.dg-q{fill:var(--surface);stroke:var(--ink-2);stroke-width:1.4}
.dg-on{fill:var(--pos-soft);stroke:var(--pos);stroke-width:1.4}
.dg-off{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1.4}
.dg-t{fill:var(--ink);font:600 15px var(--font)} .dg-s{fill:var(--ink-2);font:13px var(--font)} .dg-l{fill:var(--ink-2);font:700 13px var(--mono)}
.dg-a{stroke:var(--ink-3);stroke-width:1.6;fill:none} .dg-ah{fill:var(--ink-3)}

/* ───────── Consentimiento de cookies ───────── */
.cookie-bar{position:fixed;left:12px;right:12px;bottom:12px;z-index:var(--z-bar);max-width:720px;margin:0 auto;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:var(--shadow-pop);padding:16px 18px;display:grid;gap:12px}
.cookie-bar p{margin:0;font-size:.9rem;color:var(--ink-2)}
.cookie-bar .row{display:flex;gap:8px;flex-wrap:wrap}
.cookie-bar .btn{flex:1 1 140px}
.cookie-bar[hidden]{display:none}
@media print{
  :root{--bg:#fff;--surface:#fff;--ink:#000;--ink-2:#222;--ink-3:#444;--hair:#ccc;--line:#999}
  .cookie-bar,.site-header,.site-footer,.ad-slot,.newsletter,.nav-toggle,.theme-toggle{display:none}
  .reveal{opacity:1!important;transform:none!important}
}

/* ───────── Piezas de página ───────── */
i.dot{display:inline-block;width:9px;height:9px;border-radius:1px;margin-right:8px;vertical-align:middle}
.hero-grid{display:grid;gap:48px;grid-template-columns:1.1fr .9fr;align-items:start}
.hero-grid h1{font-size:clamp(1.95rem,4.4vw,2.9rem)}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr;gap:28px}.hero{padding-top:28px}}
.kicker-list{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:8px;border-top:1px solid var(--hair);padding-top:14px}
.kicker-list li{padding-left:18px;position:relative;color:var(--ink-2);font-size:.95rem}
.kicker-list li b{color:var(--ink)}
.kicker-list li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;background:var(--accent)}
.cta-row{margin-top:26px;display:flex;gap:10px;flex-wrap:wrap}
.section{margin-top:80px}
@media (max-width:760px){.section{margin-top:56px}}
.section>h2:first-child,.section-head h2{margin-top:0}
.section-head{max-width:66ch;margin-bottom:22px}
.section-head p{color:var(--ink-2);margin:0}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.pill{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:4px 10px;font-size:.85rem}
.cols2{display:grid;gap:28px;grid-template-columns:1fr 1fr}
@media (max-width:760px){.cols2{grid-template-columns:1fr}}
.faq details{border-top:1px solid var(--hair);padding:0}
.faq details:last-child{border-bottom:1px solid var(--hair)}
.faq summary{cursor:pointer;font-weight:600;padding:16px 40px 16px 0;list-style:none;position:relative}
.faq summary:hover{color:var(--accent-text)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:50%;width:22px;height:22px;margin-top:-11px;border:1px solid var(--line);border-radius:var(--r-xs);display:grid;place-items:center;color:var(--ink-2);font:500 1rem/1 var(--mono)}
.faq details[open] summary::after{content:"−";border-color:var(--accent-line);color:var(--accent-text)}
.faq details p{color:var(--ink-2);padding-right:40px}
.tag-ver{font:600 .66rem/1.4 var(--mono);background:var(--accent-soft);color:var(--accent-text);border:1px solid var(--accent-line);padding:1px 6px;border-radius:var(--r-xs);margin-left:6px;text-transform:uppercase;letter-spacing:.03em}
.article-list{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr))}
.article-list a.card{padding:16px 18px}
.article-list h3,.article-list h2{margin:6px 0;font-size:1.08rem}

/* home: lista editorial y bloque destacado (jerarquía desigual, no rejilla uniforme) */
.split{display:grid;gap:56px;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start}
.split-head{position:sticky;top:78px}
.split-head p{color:var(--ink-2)}
@media (max-width:860px){.split{grid-template-columns:1fr;gap:20px}.split-head{position:static}}
.why-list{list-style:none;margin:0;padding:0}
.why-list li{display:grid;grid-template-columns:48px 1fr;gap:8px;padding:22px 0;border-top:1px solid var(--hair)}
.why-list li:last-child{border-bottom:1px solid var(--hair)}
.why-n{font:600 .9rem/1.6 var(--mono);color:var(--ink-3);font-variant-numeric:tabular-nums}
.why-list h3{margin:0 0 6px;font-size:1.15rem}
.why-list p{margin:0;color:var(--ink-2)}
/* herramientas: una tarjeta grande (comparador) y dos más pequeñas; icono + vista previa + CTA */
.tools{display:grid;gap:var(--s-4);grid-template-columns:1.35fr 1fr;grid-auto-rows:1fr}
.tool{display:flex;flex-direction:column;gap:var(--s-2);padding:22px}
.tool h3{margin:var(--s-3) 0 0;font-size:1.08rem}
.tool-lg{grid-row:span 2;padding:28px}
.tool-lg h3{font-size:clamp(1.3rem,2.2vw,1.6rem);margin-top:var(--s-4)}
.tool-ico{width:40px;height:40px;display:grid;place-items:center;border-radius:var(--r-md);background:var(--accent-soft);color:var(--accent-text);border:1px solid var(--accent-line)}
.tool-ico svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tool .spark{width:100%;height:auto;display:block;margin:auto 0 0;padding-top:var(--s-5)}
.spark path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.2}
.spark .grid-l{stroke:var(--grid);stroke-width:1}
.sp-1{stroke:var(--c1)} .sp-2{stroke:var(--c2)} .sp-3{stroke:var(--c6)}
.tool .mini{width:100%;max-width:240px;height:auto;display:block;margin-top:var(--s-3)}
.mini .bar{fill:var(--c6)} .mini .bar.hi{fill:var(--c1)} .mini .trk{fill:var(--sunken)}
.tool-cta{margin-top:auto;padding-top:var(--s-3);font-weight:600;font-size:.9rem;color:var(--accent-text)}
.tool-cta span{display:inline-block;transition:transform var(--dur-2) var(--ease)}
.tool:hover .tool-cta span{transform:translateX(4px)}
@media (max-width:860px){.tools{grid-template-columns:1fr;grid-auto-rows:auto}.tool-lg{grid-row:auto}}

/* ───────── Movimiento ─────────
   Regla de oro: el contenido es visible por defecto. Los estados «ocultos» solo existen bajo html.fx, que añade un script
   en línea del <head> únicamente si el navegador soporta IntersectionObserver y el usuario no pidió menos movimiento.
   Red de seguridad doble: (1) fx.js lo revela todo si falla algo y (2) una animación CSS lo fuerza a los 4 s aunque el JS no cargue. */
@keyframes fx-open{to{opacity:1;transform:none;stroke-dashoffset:0}}
@keyframes fx-pulse{0%{transform:scale(.6);opacity:.55}100%{transform:scale(2.4);opacity:0}}
.fx .reveal:not(.in){opacity:0;transform:translateY(12px);animation:fx-open .01s 4s forwards}
.fx .reveal{transition:opacity var(--dur-3) var(--ease),transform var(--dur-3) var(--ease)}
.fx .reveal.in{opacity:1;transform:none}
/* barras de reparto que crecen */
.fx [data-fx]:not(.go) .wbar rect,.fx [data-fx]:not(.go) .cmp-fill,.fx [data-fx]:not(.go) .mini .bar{transform:scaleX(0);animation:fx-open .01s 4s forwards}
.wbar rect,.cmp-fill,.mini .bar{transform-box:fill-box;transform-origin:0 50%;transition:transform var(--dur-4) var(--ease)}
.wbar rect:nth-child(2),.mini .bar:nth-of-type(2){transition-delay:70ms} .wbar rect:nth-child(3),.mini .bar:nth-of-type(3){transition-delay:140ms}
.wbar rect:nth-child(4),.mini .bar:nth-of-type(4){transition-delay:210ms} .wbar rect:nth-child(5),.mini .bar:nth-of-type(5){transition-delay:280ms}
.wbar rect:nth-child(6),.mini .bar:nth-of-type(6){transition-delay:350ms} .mini .bar:nth-of-type(7){transition-delay:420ms}
/* líneas que se dibujan */
.draw{stroke-dasharray:1;stroke-dashoffset:0;transition:stroke-dashoffset 1.1s var(--ease)}
.fx [data-fx]:not(.go) .draw{stroke-dashoffset:1;animation:fx-open .01s 4s forwards}
.draw.sp-a,.draw.sp-1{transition-delay:.12s}
/* punto «en vivo» junto a la fecha de cierre */
.dot-live{position:relative;display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:8px;flex:none;vertical-align:.1em}
.dot-live::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--accent);animation:fx-pulse 2.6s var(--ease) infinite}
.theme-switching,.theme-switching *{transition:none!important}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:0s!important;transition-delay:0s!important;animation-duration:0s!important;animation-delay:0s!important;animation-iteration-count:1!important}
  .dot-live::after{display:none}
}

/* ───────── Utilidades de maquetación (sustituyen a los estilos en línea) ───────── */
[hidden]{display:none!important}
.hero.tight{padding-top:14px}
.prose.pt{padding-top:18px}
.prose.sub>p:first-of-type{font-size:inherit;color:inherit}
.container.w860{max-width:860px}
.first{margin-top:0}
.flush{margin:0}
.mb{margin-bottom:18px}
.gap-top{margin-top:12px}
.gap-top-lg{margin-top:22px}
.r{text-align:right}
th.left,td.left{text-align:left}
.link-plain{color:inherit;text-decoration:none}
.link-plain:hover{text-decoration:underline}
.chart-box{min-height:340px}
.chart-box.md{min-height:360px}
.chart-box.lg{min-height:380px}
.chart-box.short{min-height:240px}
.note-under{margin:12px 0 0}
.hero-kpi{margin-top:26px}
.hero-kpi .v.neg{color:var(--neg)}
.cols2.top{align-items:start}
.narrow-form{max-width:360px;margin-bottom:12px}
.card.oos .k{font:500 .72rem/1.4 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}

/* ───────── Ficha de estrategia ───────── */
.secnav{display:flex;flex-wrap:wrap;gap:6px 16px;margin:18px 0 6px;padding:10px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);font-size:.85rem}
.secnav a{color:var(--ink-2);text-decoration:none}
.secnav a:hover{color:var(--accent-text)}
.ficha{display:grid;grid-template-columns:minmax(120px,max-content) 1fr;gap:6px 22px;margin:0}
.ficha dt{font:500 .72rem/1.6 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em}
.ficha dd{margin:0;color:var(--ink)}
.ficha-cols{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.steps{padding-left:1.2em}
.steps li{margin-bottom:6px}
.fuentes{padding-left:1.2em;font-size:.9rem}
.fuentes li{margin-bottom:4px}
.byline{margin:6px 0 0}
.byline a{color:inherit}

/* ───────── Buscador ───────── */
.buscador{margin:6px 0 18px}
.buscador .field{max-width:520px;margin-bottom:10px}
.bq-filtros{display:flex;flex-wrap:wrap;gap:10px 22px;margin:8px 0 4px}
.bq-grupo{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.bq-rotulo{font:500 .7rem/1.4 var(--mono);color:var(--ink-3);text-transform:uppercase;letter-spacing:.04em;margin-right:2px}
.bq-limpiar{border-style:dashed}
.tbl-est tbody tr:focus-within td{background:var(--accent-soft)}
.tbl-est td .xs{font-size:.74rem}

/* buscador de la cabecera: combobox con lista desplegable */
.site-search input{width:100%}
.ss-lista{position:absolute;left:0;right:0;top:calc(100% + 4px);margin:0;padding:4px;list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:var(--shadow-pop);z-index:var(--z-bar);min-width:260px}
.ss-lista li{display:flex;flex-direction:column;padding:6px 10px;border-radius:var(--r-xs);cursor:pointer}
.ss-lista li a{color:var(--ink);text-decoration:none;font-size:.9rem;font-weight:500}
.ss-lista li[aria-selected="true"]{background:var(--accent-soft);outline:1px solid var(--accent-line)}
.ss-sub{font-size:.74rem;color:var(--ink-3)}
.ss-vacio{padding:8px 10px;font-size:.85rem;color:var(--ink-3)}
.site-search input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238B95A5' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='4.5'/%3E%3Cpath d='M10.5 10.5L14 14'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:9px 50%;background-size:15px}
.site-search input:disabled{opacity:.6}

.signal-grid{display:grid;gap:var(--s-4);grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:700px){.signal-grid{grid-template-columns:1fr}}
.signal-grid .signal{margin:0}
.home-search{display:flex;gap:10px;width:100%}
.home-search input{flex:1;min-width:0}

/* Móvil: objetivos táctiles de al menos 44 px */
@media(max-width:700px){
  .brand{min-height:44px}
  .pill{display:inline-flex;align-items:center;min-height:44px;padding:4px 14px}
  .chip{min-height:44px}
  input[type="checkbox"],input[type="radio"]{width:20px;height:20px;min-height:0;flex:none}
}

/* ───────── Mi cartera ───────── */
.section.tight-top{margin-top:40px}
.follow{margin:10px 0 0;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.btn[data-follow][aria-pressed="true"]{border-color:var(--accent-line);background:var(--accent-soft);color:var(--accent-text)}
.btn[data-follow][aria-pressed="true"] .ico svg{fill:currentColor}
.btn.danger{color:var(--neg);border-color:color-mix(in srgb,var(--neg) 40%,transparent)}
.btn.danger:hover{background:var(--neg-soft);border-color:var(--neg)}
.acct{display:grid;gap:14px}
.acct-box{display:grid;gap:14px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-md);padding:18px 20px}
.acct-box p{margin:6px 0 0}
.acct .row,.acct-tools{display:flex;gap:8px;flex-wrap:wrap}
.login{display:grid;gap:12px}
.login .field{margin:0}
.login .nl-consent{display:flex;gap:8px;align-items:flex-start;line-height:1.45;font-weight:400;color:var(--ink-2)}
.login .nl-consent input{flex:0 0 auto;width:auto;min-height:0;margin-top:3px}
.acct .note{margin:0}
@media (max-width:760px){.acct-box{grid-template-columns:1fr}}
.pos-list{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.pos-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:14px}
.pos-head h3{margin:0 0 6px}
.cpos h4{margin:18px 0 8px;font-size:.95rem}
.cpos .kpi-strip{margin-bottom:8px}
.pos-edit{margin-top:16px;border-top:1px solid var(--hair);padding-top:12px}
.pos-edit summary{cursor:pointer;font-weight:600;color:var(--accent-text)}
.mov{display:grid;grid-template-columns:minmax(150px,1.2fr) minmax(130px,1fr) minmax(110px,1fr) auto;gap:8px;align-items:center;margin-bottom:8px}
.mov-t{font-size:.88rem;color:var(--ink-2)}
.mov-new{display:grid;grid-template-columns:minmax(190px,1.4fr) minmax(130px,1fr) minmax(110px,1fr) auto;gap:8px;align-items:center;margin-top:12px}
.seg-add{display:flex;gap:8px;margin:14px 0 8px;max-width:460px}
@media (max-width:640px){.mov,.mov-new{grid-template-columns:1fr 1fr}.mov-t{grid-column:1/-1}.mov-new select{grid-column:1/-1}}
.nav a{white-space:nowrap}

/* ═══════════ Rediseño v2: hero, tarjetas, confianza, publicidad ═══════════ */
.hero-v2{padding:var(--s-7) 0 0;position:relative;isolation:isolate}
.hero-v2::before{content:"";position:absolute;inset:0 -20px auto -20px;height:100%;background:var(--glow);z-index:-1;pointer-events:none}
.hero-v2 .hero-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--s-7);align-items:center}
.hero-copy h1{max-width:18ch;font-size:clamp(2rem,4.6vw,3.1rem)}
.hero-v2 p.lead{max-width:56ch}
@media (max-width:900px){.hero-v2{padding-top:var(--s-5)}.hero-v2 .hero-grid{grid-template-columns:1fr;gap:var(--s-6)}.hero-copy h1{max-width:none}}
.trust-row{list-style:none;margin:var(--s-5) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);font-size:.84rem}
.trust-row li{display:flex;align-items:center;gap:8px;color:var(--ink-2)}
.trust-row svg{width:15px;height:15px;fill:none;stroke:var(--accent-text);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.trust-row a{color:var(--ink-2);text-decoration:none}
.trust-row a:hover{color:var(--ink);text-decoration:underline}

/* tarjeta destacada del hero: «Mejor del último mes» */
.hero-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:var(--s-5);box-shadow:var(--shadow-2),inset 0 1px 0 var(--hair-hi);position:relative}
.hc-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s-2) var(--s-3);margin-bottom:var(--s-4)}
.hc-title{margin:0;font:600 .9rem/1.3 var(--font);letter-spacing:0;color:var(--ink-2)}
.seal{display:inline-flex;align-items:center;margin:0;padding:5px 10px 5px 12px;border:1px solid var(--accent-line);border-radius:999px;background:var(--accent-soft);color:var(--accent-text);font:600 .72rem/1.2 var(--mono);letter-spacing:.01em}
.seal .dot-live{margin-right:8px}
.hc-name{display:inline-block;font-size:1.15rem;font-weight:650;letter-spacing:-.012em;color:var(--ink);text-decoration:none}
.hc-name:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.hc-val{margin:var(--s-1) 0 var(--s-4);font-size:clamp(2.6rem,6vw,3.6rem);font-weight:600;line-height:1;letter-spacing:-.045em}
.cmp{display:grid;gap:10px;padding:var(--s-4) 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.cmp-row{display:grid;grid-template-columns:minmax(84px,.9fr) minmax(0,2fr) auto;gap:var(--s-3);align-items:center;font-size:.84rem}
.cmp-l{color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-bar{display:block;width:100%;height:8px;border-radius:2px;overflow:hidden;background:var(--sunken)}
.cmp-fill{fill:var(--c6)} .cmp-fill.a{fill:var(--accent)} .cmp-fill.neg{fill:var(--neg)}
.cmp-row b{font-size:.9rem;font-weight:600;min-width:6.2ch;text-align:right}
.hc-spark{display:block;width:100%;height:auto;margin-top:var(--s-4);overflow:visible}
.hc-spark path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.2;vector-effect:non-scaling-stroke}
.hc-spark .sp-a{stroke:var(--accent)} .hc-spark .sp-b{stroke:var(--c6);stroke-width:1.8}
.hc-spark .sp-base{stroke:var(--grid);stroke-width:1;stroke-dasharray:3 4;vector-effect:non-scaling-stroke}
.hc-note{margin:var(--s-3) 0 0;font-size:.74rem;line-height:1.5;color:var(--ink-3)}
.key{display:inline-block;width:12px;height:3px;border-radius:2px;margin:0 6px 2px 0;vertical-align:middle}
.key-a{background:var(--accent)} .key-b{background:var(--c6);margin-left:8px}

/* cabeceras de sección con variaciones de ritmo */
.hero-v2+.ad-slot{margin-top:var(--s-7)}
.section-head.row{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-5);max-width:none}
.section-head.row>div{max-width:66ch}
.more{flex:none;font-weight:600;font-size:.9rem;text-decoration:none;white-space:nowrap;padding-bottom:3px}
.more span{display:inline-block;transition:transform var(--dur-2) var(--ease)}
.more:hover span{transform:translateX(4px)}
@media (max-width:640px){.section-head.row{flex-direction:column;align-items:flex-start;gap:var(--s-2)}}
.search-band{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-5) var(--s-6);align-items:center;background:var(--surface);border:1px solid var(--hair);border-radius:var(--r-lg);padding:var(--s-5) var(--s-6);box-shadow:var(--shadow-1)}
.search-band h2{margin:0 0 6px;font-size:1.25rem}
.search-band p{margin:0;color:var(--ink-2);font-size:.92rem}
@media (max-width:860px){.search-band{grid-template-columns:1fr;padding:var(--s-5)}}
.data-split{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.data-split .split-head{position:static}
@media (max-width:1000px){.data-split{grid-template-columns:1fr}}

/* tarjetas con elevación al pasar el ratón (solo transform y sombra) */
.card-lift{transition:transform var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease),border-color var(--dur-2),background-color var(--dur-2);box-shadow:var(--shadow-1)}
a.card.card-lift:hover{transform:translateY(-3px);box-shadow:var(--shadow-2);border-color:var(--line);background:var(--surface)}
a.card.card-lift:active{transform:translateY(-1px)}
@media (hover:none){a.card.card-lift:hover{transform:none}}

/* guías */
.guides{grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--s-4)}
.guide-card{display:flex!important;flex-direction:column;gap:var(--s-2);padding:var(--s-5)!important}
.guide-card h3{margin:var(--s-2) 0 0!important;font-size:1.08rem;line-height:1.3}
.guide-card p{flex:1}
.gc-meta{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}
.cat{--cat:var(--ink-3);display:inline-flex;align-items:center;gap:7px;padding:3px 9px 3px 8px;border-radius:var(--r-xs);border:1px solid color-mix(in srgb,var(--cat) 40%,transparent);background:color-mix(in srgb,var(--cat) 12%,transparent);color:var(--ink);font:600 .68rem/1.4 var(--mono);letter-spacing:.04em;text-transform:uppercase}
.cat i{width:7px;height:7px;border-radius:50%;background:var(--cat)}
.cat-1{--cat:var(--cat-1)}.cat-2{--cat:var(--cat-2)}.cat-3{--cat:var(--cat-3)}.cat-4{--cat:var(--cat-4)}.cat-5{--cat:var(--cat-5)}.cat-6{--cat:var(--cat-6)}
.gc-read{display:inline-flex;align-items:center;gap:6px;font:500 .74rem/1 var(--mono);color:var(--ink-3);white-space:nowrap}
.gc-read svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.gc-cta{margin-top:var(--s-3);font-weight:600;font-size:.86rem;color:var(--accent-text)}
.gc-cta span{display:inline-block;transition:transform var(--dur-2) var(--ease)}
.guide-card:hover .gc-cta span{transform:translateX(4px)}

/* nota del editor y señales de confianza */
.editor-card{display:grid;grid-template-columns:auto 1fr;gap:var(--s-3) var(--s-4);align-items:center;margin-top:var(--s-5);padding:var(--s-4);border:1px solid var(--hair);border-radius:var(--r-md);background:var(--surface);box-shadow:var(--shadow-1)}
.monogram{width:44px;height:44px;display:grid;place-items:center;border-radius:var(--r-md);background:var(--accent-soft);border:1px solid var(--accent-line);color:var(--accent-text);font:700 .95rem/1 var(--mono);letter-spacing:.02em}
.ec-name{margin:0;font-weight:650}
.ec-name a{color:var(--ink)}
.ec-role{margin:0;font-size:.82rem;color:var(--ink-3)}
.ec-links{grid-column:1/-1;list-style:none;margin:0;padding:var(--s-3) 0 0;border-top:1px solid var(--hair);display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4);font-size:.84rem}
.disclaimer{display:grid;grid-template-columns:auto 1fr;gap:var(--s-3);align-items:start;max-width:none;margin-top:var(--s-7);padding:var(--s-4) var(--s-5);border:1px solid var(--hair);border-top:1px solid var(--hair);border-radius:var(--r-md);background:var(--sunken);color:var(--ink-2)}
.disclaimer svg{width:18px;height:18px;margin-top:2px;fill:none;stroke:var(--accent-text);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.disclaimer span{max-width:90ch}

/* páginas con lateral publicitario (solo escritorio) */
.with-rail{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-7)}
.rail{display:none}
@media (min-width:1100px){
  .with-rail.has-rail{grid-template-columns:minmax(0,1fr) 300px;align-items:start}
  .has-rail .rail{display:block;position:sticky;top:78px;align-self:start}
}

/* microinteracciones */
.theme-toggle svg{transition:transform var(--dur-3) var(--ease)}
.theme-toggle:hover svg{transform:rotate(18deg)}
.theme-toggle:active svg{transform:rotate(90deg) scale(.85)}
.btn{transition:background-color .15s,border-color .15s,color .15s,transform var(--dur-1) var(--ease),box-shadow var(--dur-2)}
.btn:hover{box-shadow:0 6px 16px -8px color-mix(in srgb,var(--accent) 70%,transparent)}
.btn.ghost:hover{box-shadow:none}
.site-search kbd{transition:opacity var(--dur-1)}
.site-search:focus-within kbd{opacity:0}
::-webkit-scrollbar{height:10px;width:10px}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:6px;border:2px solid var(--bg)}
::-webkit-scrollbar-track{background:transparent}
*{scrollbar-color:var(--line) transparent}
.tablewrap{scrollbar-width:thin}
.rail-main{min-width:0}
.guide-layout>article{min-width:0;max-width:760px}
.guide-layout:not(.has-rail)>article{margin:0 auto}
.guide-layout .prose h2{scroll-margin-top:78px}
body{overflow-x:clip}
.split-head h2{margin-top:0}
.tool h3{margin-bottom:6px}
.tools{grid-auto-rows:auto}
.tool-lg .tool-cta{margin-top:0;padding-top:var(--s-4)}
.tool-lg .spark{padding-top:var(--s-6)}
@media (max-width:860px){.tool-lg .spark{padding-top:var(--s-4)}}
@media (max-width:960px){.site-search kbd{display:none}}
@media (max-width:640px){
  .tbl-stack tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 12px}
  .tbl-stack td:first-child,.tbl-stack td.left{grid-column:1/-1}
  .tbl-stack td.r{flex-direction:column;align-items:flex-start;text-align:left;gap:2px}
  .tbl-stack td.r.neg::before,.tbl-stack td.r::before{color:var(--ink-3)}
}
.hc-spark{height:104px}
.signal-grid{align-items:start}
.signal-foot{margin-top:0;padding-top:12px}
@media (max-width:640px){.tbl-stack td.wrap{grid-column:1/-1}}