*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font-family:'General Sans',system-ui,sans-serif;
line-height:1.6;font-size:16px}
a{color:var(--public-accent);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:880px;margin:0 auto;padding:0 20px}
header.site{border-bottom:1px solid var(--border);background:var(--card)}
header.site .wrap{display:flex;align-items:center;gap:18px;padding:14px 20px;flex-wrap:wrap}
header.site img{height:34px;width:auto}
header.site .brand{font-weight:700;font-size:1.15rem;color:var(--text)}
header.site nav{margin-left:auto;display:flex;gap:18px;font-size:.95rem}
.lang-toggle{display:flex;gap:2px;font-size:.85rem}
.lang-toggle a{padding:3px 8px;border-radius:6px;color:var(--dim)}
.lang-toggle a:hover{text-decoration:none;color:var(--public-accent)}
.lang-toggle a.active{background:var(--accent-soft);color:var(--public-accent);font-weight:700}
#theme-toggle-btn{width:32px;height:32px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
border-radius:50%;border:1px solid var(--border);background:var(--card);color:var(--dim);cursor:pointer;font-family:inherit}
#theme-toggle-btn:hover{border-color:var(--public-accent);color:var(--public-accent)}
#theme-toggle-btn svg{width:16px;height:16px}
/* ── /simulador ────────────────────────────────────────────────── */
/* Página con más elementos lado a lado (gráfica + panel) que el resto de
   páginas SSR (prosa) — ensancha solo esta página, sin tocar _layout(). */
body:has(#sim-universe-tabs) .wrap{max-width:1100px}
.sim-actions{margin:16px 0}
.btn-simulate{display:inline-flex;align-items:center;gap:8px;background:var(--public-accent);color:var(--card);
border:none;padding:11px 22px;border-radius:9px;font-weight:600;font-size:.95rem;cursor:pointer;font-family:inherit}
.btn-simulate:hover{opacity:.92}
.btn-simulate:disabled{opacity:.5;cursor:not-allowed}
.sim-error{color:var(--danger);font-size:.9rem;margin-top:8px}
.sim-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:8px 0 32px}
.sim-preview-item{padding:18px;border:1px solid var(--border);border-radius:10px;background:var(--card)}
.sim-preview-item svg{width:22px;height:22px;color:var(--public-accent);margin-bottom:8px}
.sim-preview-item h4{font-size:.95rem;margin-bottom:4px}
.sim-preview-item p{font-size:.85rem;color:var(--dim);margin-bottom:0}
.sim-body{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;margin-top:18px}
.hidden{display:none}
.sim-chart-meta{font-size:.85rem;color:var(--dim);margin:2px 0 10px}
.sim-chart-wrap{position:relative;height:clamp(340px,34vw,480px)}
.sim-stats{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.sim-stat{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:10px 14px}
.sim-stat-lbl{display:block;font-size:.75rem;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.sim-stat-val{display:block;font-size:1.1rem;font-weight:700;margin-top:2px}
.sim-type-tabs{margin-bottom:14px}
.sim-type-tabs a,.sim-type-tabs button{padding:5px 12px;font-size:.8rem}
#sim-highlight-metric{color:var(--public-accent)}
table.corr-table{width:100%;border-collapse:collapse;font-size:.85rem}
table.corr-table td,table.corr-table th{padding:6px 8px;text-align:center;border-bottom:1px solid var(--border)}
table.corr-table th{color:var(--dim);font-weight:600}
table.corr-table td:first-child,table.corr-table th:first-child{text-align:left}
.faq details{border-bottom:1px solid var(--border);padding:4px 0}
.faq summary{cursor:pointer;font-weight:600;padding:10px 0}
.faq summary::-webkit-details-marker{display:none}
.faq p{color:var(--dim);padding-bottom:12px}
.universe-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.universe-tabs a,.universe-tabs button{padding:6px 14px;border-radius:20px;border:1px solid var(--border);background:none;color:var(--text);font-size:.9rem;font-family:inherit;cursor:pointer}
.universe-tabs a:hover,.universe-tabs button:hover{text-decoration:none;border-color:var(--public-accent);color:var(--public-accent)}
.universe-tabs a.active,.universe-tabs button.active{background:var(--public-accent);border-color:var(--public-accent);color:var(--card);font-weight:700}
main{padding:32px 0 56px}
h1{font-size:1.9rem;line-height:1.25;margin-bottom:14px}
h2{font-size:1.3rem;margin:30px 0 12px}
h3{font-size:1.08rem;margin:22px 0 8px}
p{margin-bottom:14px}
.lead{font-size:1.08rem;color:var(--dim);margin-bottom:22px}
.crumbs{font-size:.85rem;color:var(--dim);margin-bottom:18px}
.crumbs a{color:var(--dim)}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px;margin:18px 0}
table.stats{width:100%;border-collapse:collapse;margin:8px 0}
table.stats td{padding:9px 6px;border-bottom:1px solid var(--border);font-size:.96rem}
table.stats td:first-child{color:var(--dim)}
table.stats td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.pos{color:var(--success)}.neg{color:var(--danger)}
.cta{display:inline-block;background:var(--public-accent);color:var(--card);padding:11px 20px;border-radius:9px;
font-weight:600;margin:6px 0}
.cta:hover{text-decoration:none;opacity:.92}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.grid a{background:var(--card);border:1px solid var(--border);border-radius:9px;padding:11px 13px;
display:block;color:var(--text);font-size:.92rem}
.grid a:hover{border-color:var(--public-accent);text-decoration:none}
.grid a b{color:var(--public-accent)}
.grid a span{display:block;color:var(--dim);font-size:.8rem;margin-top:2px;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sector-h{margin:26px 0 10px;font-size:1.05rem;color:var(--public-accent);font-weight:600}
ul.links{list-style:none;margin:10px 0}
ul.links li{padding:6px 0;border-bottom:1px solid var(--border)}
.article p,.article li{font-size:1.02rem}
.article ul{margin:10px 0 16px 22px}
.article li{margin-bottom:6px}
.disclaimer{font-size:.82rem;color:var(--dim);border-top:1px solid var(--border);
margin-top:34px;padding-top:16px}
footer.site{border-top:1px solid var(--border);background:var(--card);padding:22px 0;
font-size:.85rem;color:var(--dim)}
footer.site a{color:var(--dim)}
footer.site .wrap{display:flex;gap:18px;flex-wrap:wrap}
@media(max-width:560px){h1{font-size:1.5rem}header.site nav{width:100%;margin:0}.sim-preview{grid-template-columns:1fr}}
/* ── Banner promocional (fichas de ticker/sector/guía) ───────────── */
/* Mismo lenguaje visual que los modales modernizados de la SPA (ver
   frontend/style.css::note-modal): cinta superior en color-mix(--accent) en
   vez de hex fijo (sigue el tema activo), borde con tinte de acento en vez de
   gris neutro, radio 14px, easing de deceleración en la entrada. */
.promo-banner{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.96);
z-index:500;width:min(360px,calc(100vw - 32px));background:var(--card);
border:1px solid color-mix(in srgb, var(--public-accent) 35%, var(--border));
border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,.28);padding:24px 24px 22px;text-align:center;
opacity:0;pointer-events:none;transition:opacity .22s cubic-bezier(.16,1,.3,1),transform .22s cubic-bezier(.16,1,.3,1)}
.promo-banner::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;
border-radius:14px 14px 0 0;
background:linear-gradient(90deg,color-mix(in srgb, var(--public-accent) 55%, transparent),
var(--public-accent) 50%,color-mix(in srgb, var(--public-accent) 55%, transparent))}
.promo-banner.hidden{display:none}
.promo-banner.is-open{opacity:1;transform:translate(-50%,-50%) scale(1);pointer-events:auto}
.promo-banner-close{position:absolute;top:6px;right:8px;background:none;border:none;
font-size:22px;line-height:1;color:var(--dim);cursor:pointer;padding:6px;font-family:inherit}
.promo-banner-close:hover{color:var(--text)}
.promo-banner-close:active{transform:scale(.92)}
.promo-banner-title{font-weight:700;font-size:1.02rem;margin-bottom:4px}
.promo-banner-sub{font-size:.9rem;color:var(--dim);margin-bottom:16px}
.promo-banner-cta{display:inline-flex;align-items:center;gap:7px;background:var(--public-accent);color:var(--card);
padding:10px 20px;border-radius:9px;font-weight:600;font-size:.92rem}
.promo-banner-cta:hover{text-decoration:none;opacity:.92}
.promo-banner-cta:active{transform:scale(.96)}
.promo-banner-cta svg{flex-shrink:0}
@media(prefers-reduced-motion:reduce){.promo-banner{transition:none}}