/* Trend & Structure · hoja de estilos única (sin recursos externos; CSP style-src 'self').
   B-02: SISTEMA VISUAL PREMIUM. Un solo sistema de tokens (los nombres de siempre, ampliados; equivalencias con la nomenclatura --ts-* en docs/audits/B-02-premium-redesign.md).
   Todo valor de color, espacio, radio, sombra y tipografía sale de los tokens de :root; los componentes no llevan valores sueltos. Reglas semánticas que NO se mezclan:
     · MARCA / ACENTO        → --accent (bronce/oro contenido): foco, enlaces, selección, marca. Nunca significa «ganancia».
     · RESULTADO FINANCIERO  → --gain / --loss (solo importes y R: verde/rojo)
     · ESTADO DE NEGOCIO     → --st-* (abierta, cerrada, cancelada, eliminada, activa, inactiva): neutros/azul pizarra, nunca verde ni rojo
   Avisos al usuario (--ok/--warn/--err/--info) son de feedback, no de estado ni de resultado.
   El modo oscuro redefine los MISMOS tokens (un solo sistema, misma jerarquía). */

/* ── 1 · TOKENS ─────────────────────────────────────────────────────────────────────────────────────────────────────── */
:root {
  /* superficies (de más profunda a más elevada): fondo de página → panel → superficie → superficie elevada */
  --bg: #ebe7de; --panel: #e2ddd0; --surface-2: #f2eee5; --surface: #f9f6ef; --surface-elevated: #fffdf8; --surface-hover: #efe9db;
  --border: #d8d1c0; --border-strong: #b8af99; --active: #e8dfc7;
  /* texto */
  --text: #14161b; --text-2: #363a43; --muted: #5c606a;
  /* acento de marca (bronce/oro contenido); --gold es solo decorativo (no texto) */
  --accent: #7a5818; --accent-strong: #5c410f; --on-accent: #fffaf0; --accent-soft: #efe4c8; --gold: #b8923e; --on-gold: #1a1408; /* texto sobre fondo oro (botón central de la barra inferior) */
  /* acción principal: grafito */
  --btn-bg: #1a1e26; --btn-bg-hover: #2b313d; --btn-fg: #f7f2e7;
  /* resultado financiero */
  --gain: #19694a; --loss: #a8261b;
  /* estado de negocio (NO verde/rojo) */
  --st-open-fg: #2b4a73; --st-open-bg: #e1e8f2; --st-open-bd: #b2c2d9;
  --st-closed-fg: #363a43; --st-closed-bg: #e8e3d6; --st-closed-bd: #cfc8b6;
  --st-cancelled-fg: #5c606a; --st-cancelled-bd: #b0a892;
  --st-deleted-fg: #5c606a; --st-deleted-bd: #b0a892;
  /* avisos de feedback */
  --ok: #19694a; --ok-bg: #dfeee4; --warn: #774c00; --warn-bg: #f6e8c4; --err: #a8261b; --err-bg: #f5dfda; --info-bg: #e4e7ec;
  /* navegación lateral (grafito) */
  --nav-bg: #14171d; --nav-bg-2: #1b1f27; --nav-line: #2a303b; --nav-text: #b6bbc6; --nav-muted: #8d93a0; --nav-text-strong: #f7f2e7; --nav-active-bg: #262c37; --nav-cta-bg: #c9a24b; --nav-cta-fg: #17130a;
  /* espaciado (4 px) */
  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-5: 1.5rem; --space-6: 2rem; --space-7: 3rem;
  /* forma */
  --radius: 8px; --radius-sm: 5px; --radius-lg: 14px; --radius-pill: 999px;
  /* tipografía: marca (serif de sistema) · interfaz · cifras financieras (tabulares, líneas) · datos técnicos (monoespaciada); ninguna por debajo de 12 px */
  --font-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
  --font-ui: system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-financial: "Segoe UI Variable Display", "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-data: "Cascadia Mono", "SF Mono", ui-monospace, Consolas, "Liberation Mono", Menlo, monospace;
  --fs-xs: .75rem; --fs-sm: .8125rem; --fs-base: .9375rem; --fs-md: 1rem; --fs-lg: 1.125rem; --fs-xl: 1.5rem; --fs-2xl: 1.875rem; --fs-3xl: 2.5rem; --fs-4xl: 3.25rem;
  /* densidad de tabla */
  --row-pad-y: .5rem; --cell-pad-x: .7rem;
  /* panel «hero»: grafito profundo con hilo de oro; colores de resultado propios (contraste sobre fondo oscuro) */
  --hero-bg: #171b23; --hero-line: #2e3441; --hero-text: #f3eee2; --hero-muted: #a9aebb; --hero-gain: #5fd39a; --hero-loss: #ff9086;
  /* sombras (elevación) */
  --shadow-1: 0 1px 2px rgba(20, 22, 27, .08), 0 1px 1px rgba(20, 22, 27, .05);
  --shadow-2: 0 6px 18px rgba(20, 22, 27, .10), 0 1px 3px rgba(20, 22, 27, .08);
  /* compatibilidad con las pantallas anteriores (mismos nombres, mismos significados) */
  --primary: var(--accent); --on-primary: var(--on-accent); --pos: var(--gain); --neg: var(--loss);
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0e1014; --panel: #14171d; --surface-2: #181b22; --surface: #1c2028; --surface-elevated: #222733; --surface-hover: #262c38;
    --border: #2b313c; --border-strong: #3d4552; --active: #2c2a20;
    --text: #ece8dd; --text-2: #c8c5bb; --muted: #9a9ea9;
    --accent: #d6b463; --accent-strong: #e8cc86; --on-accent: #15110a; --accent-soft: #2a2516; --gold: #c9a24b;
    --btn-bg: #d0aa55; --btn-bg-hover: #e0bf72; --btn-fg: #15110a;
    --gain: #5fd39a; --loss: #f4877d;
    --st-open-fg: #9db8e0; --st-open-bg: #1b2638; --st-open-bd: #34496b;
    --st-closed-fg: #c8c5bb; --st-closed-bg: #232833; --st-closed-bd: #3a4250;
    --st-cancelled-fg: #9a9ea9; --st-cancelled-bd: #4a5262;
    --st-deleted-fg: #9a9ea9; --st-deleted-bd: #4a5262;
    --ok: #5fd39a; --ok-bg: #12291d; --warn: #efc56b; --warn-bg: #31270c; --err: #f4877d; --err-bg: #381b18; --info-bg: #212633;
    --hero-bg: #12151b; --hero-line: #2a303b; --hero-text: #f3eee2; --hero-muted: #a9aebb; --hero-gain: #5fd39a; --hero-loss: #f4877d;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .5);
    --shadow-2: 0 8px 24px rgba(0, 0, 0, .45), 0 1px 3px rgba(0, 0, 0, .5);
    --nav-bg: #090b0e; --nav-bg-2: #101319; --nav-line: #22272f; --nav-text: #a9aebb; --nav-muted: #8d93a0; --nav-text-strong: #f3eee2; --nav-active-bg: #1b1f27; --nav-cta-bg: #d0aa55; --nav-cta-fg: #15110a;
  }
}

/* ── 2 · BASE ───────────────────────────────────────────────────────────────────────────────────────────────────────── */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font: var(--fs-base)/1.5 var(--font-ui); -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-underline-offset: 3px; }
h1 { font-size: var(--fs-xl); line-height: 1.2; margin: 0 0 var(--space-3); letter-spacing: -.015em; font-weight: 700; }
h2 { font-size: var(--fs-md); margin: 0 0 var(--space-2); letter-spacing: -.005em; }
.muted { color: var(--muted); } .small { font-size: var(--fs-sm); }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: var(--space-2); top: -4rem; z-index: 100; padding: var(--space-2) var(--space-4); background: var(--accent);
  color: var(--on-accent); border-radius: var(--radius); font-weight: 600; text-decoration: none; }
.skip-link:focus { top: var(--space-2); }

/* ── 3 · MARCO: APP SHELL (menú lateral, barra superior, página) ────────────────────────────────────────────────────── */
body.has-shell { display: grid; grid-template-columns: 252px minmax(0, 1fr); min-height: 100vh; }
.main { min-width: 0; display: flex; flex-direction: column; }
.band { text-align: center; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .1em; padding: .3rem; }
.band-demo { background: var(--warn-bg); color: var(--warn); border-bottom: 1px solid var(--border); }
.page { width: 100%; max-width: 1360px; margin: 0 auto; padding: var(--space-5) var(--space-5) var(--space-7); flex: 1; }
.page:focus { outline: none; }
.page > * + * { margin-top: var(--space-4); }
.page-header { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-2) var(--space-4); }
.page-header h1 { margin: 0; }
.page-header .meta { color: var(--muted); font-size: var(--fs-sm); }
.page-header .actions { margin-left: auto; }

/* ── 4 · COMPONENTES BASE ───────────────────────────────────────────────────────────────────────────────────────────── */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: var(--space-4); }
.flash { background: var(--ok-bg); color: var(--ok); padding: .65rem .9rem; border-radius: var(--radius); font-weight: 600; }
.alert { background: var(--err-bg); color: var(--err); padding: .65rem .9rem; border-radius: var(--radius); }
.warn { background: var(--warn-bg); color: var(--warn); padding: .65rem .9rem; border-radius: var(--radius); }
.info { background: var(--info-bg); padding: .65rem .9rem; border-radius: var(--radius); }
.grid { display: grid; gap: var(--space-3) var(--space-4); grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.field { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.field > span, legend { font-weight: 600; font-size: var(--fs-sm); }
fieldset { border: 0; padding: 0; margin: 0; }
input, select, textarea, button, .button { font: inherit; }
input:not([type=radio]):not([type=checkbox]), select, textarea { width: 100%; min-height: 2.4rem; padding: .4rem .6rem; border: 1px solid var(--border-strong);
  border-radius: var(--radius); background: var(--surface); color: var(--text); }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid var(--accent); outline-offset: 1px; }
[aria-invalid=true] { border-color: var(--loss) !important; }
.err { color: var(--err); font-size: var(--fs-sm); margin: 0; }
.seg { display: flex; gap: var(--space-2); } .seg label { flex: 1; text-align: center; }
.seg input { position: absolute; opacity: 0; } .seg span { display: block; padding: .5rem; border: 1px solid var(--border-strong); border-radius: var(--radius); cursor: pointer; font-weight: 700; }
.seg input:checked + span { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.seg input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 1px; }
button, .button { display: inline-flex; align-items: center; justify-content: center; min-height: 2.4rem; padding: 0 var(--space-4); border-radius: var(--radius);
  border: 1px solid var(--border-strong); background: var(--surface); color: var(--text); cursor: pointer; font-weight: 600; text-decoration: none; }
button:hover, .button:hover { background: var(--surface-hover); }
button.primary, .button.primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
button.primary:hover, .button.primary:hover { background: var(--accent-strong); border-color: var(--accent-strong); }
button.danger { background: var(--loss); border-color: var(--loss); color: var(--surface); }
button.sm, .button.sm { min-height: 2rem; padding: 0 var(--space-3); font-size: var(--fs-sm); }
button[disabled] { opacity: .6; cursor: progress; }
.actions { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
th, td { padding: var(--row-pad-y) var(--cell-pad-x); border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; }
th { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
td.n, th.n { text-align: right; }
.table-wrap { overflow-x: auto; }
.pos { color: var(--gain); font-weight: 700; } .neg { color: var(--loss); font-weight: 700; }
.badge { display: inline-block; padding: .05rem .5rem; border-radius: var(--radius-pill); font-size: var(--fs-xs); font-weight: 700; background: var(--info-bg); }
.badge.unverified { background: var(--warn-bg); color: var(--warn); } .badge.verified { background: var(--ok-bg); color: var(--ok); }
.badge.pending { background: var(--err-bg); color: var(--err); }
.badge.deleted { background: transparent; color: var(--st-deleted-fg); border: 1px dashed var(--st-deleted-bd); }  /* eliminada = estado, no error */
dl.kv { display: grid; grid-template-columns: max-content 1fr; gap: .3rem 1.25rem; margin: 0; }
dl.kv dt { color: var(--muted); } dl.kv dd { margin: 0; font-variant-numeric: tabular-nums; }
.result { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.big { font-size: var(--fs-2xl); font-weight: 800; font-variant-numeric: tabular-nums; }
.sticky-actions { position: sticky; bottom: 0; background: linear-gradient(transparent, var(--bg) 30%); padding: var(--space-3) 0; }
.nomargin { margin: 0; } .mt { margin-top: var(--space-3); }
.narrow { max-width: 520px; margin-inline: auto; }
.stack { display: flex; flex-direction: column; gap: var(--space-4); }
ul.plain { list-style: none; margin: 0; padding: 0; } ul.plain li { padding: .2rem 0; }
.check { display: flex; gap: var(--space-2); align-items: center; min-height: 2.4rem; }
.tag { display: inline-block; margin-left: var(--space-2); padding: .05rem .5rem; border-radius: var(--radius-pill); font-size: var(--fs-xs); font-weight: 700;
  letter-spacing: .05em; background: var(--info-bg); color: var(--accent); vertical-align: middle; }
.calc-panel { border: 1px dashed var(--border-strong); border-radius: var(--radius); padding: var(--space-3) var(--space-4); background: var(--bg); }
.calc-panel h2 { font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
dl.kv.calc { grid-template-columns: max-content 1fr; }
.section-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.section-title { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 0 0 var(--space-2); }
.pager { display: flex; gap: var(--space-2); align-items: center; justify-content: center; padding: var(--space-2) 0; }
.changes { margin: .15rem 0 0; padding-left: var(--space-4); font-size: var(--fs-sm); color: var(--muted); }
th.sep, td.sep { border-left: 1px solid var(--border); }
.prewrap { white-space: pre-wrap; overflow-wrap: anywhere; }
.is-deleted td { opacity: .55; }
.deleted-row td { opacity: .55; text-decoration: line-through; }
.deleted-row td:last-child { text-decoration: none; opacity: 1; }
.form-block { display: flex; flex-direction: column; gap: var(--space-3); }
.form-block + .form-block { border-top: 1px solid var(--border); padding-top: var(--space-4); }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chips label { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .65rem; border: 1px solid var(--border-strong);
  border-radius: var(--radius-pill); cursor: pointer; font-size: var(--fs-sm); background: var(--surface); }
.chips label:has(input:checked) { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); font-weight: 600; }
.pill { display: inline-block; padding: .1rem .55rem; border-radius: var(--radius-pill); background: var(--info-bg); font-size: var(--fs-sm); margin: 0 .25rem .25rem 0; }
.pill.err-pill { background: var(--err-bg); color: var(--err); }
.sub-title { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin: var(--space-3) 0 var(--space-1); }
.inline-form { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: var(--space-1) 0; }
.inline-form input[name=name] { min-width: 12rem; }

/* ── 5 · COMPONENTES NUEVOS (Bloque 10) ─────────────────────────────────────────────────────────────────────────────── */
/* Valor financiero: números en la fuente de DATOS, alineados, con signo; color solo para ganancia/pérdida (el signo siempre está). */
.fin { font-family: var(--font-data); font-variant-numeric: tabular-nums; white-space: nowrap; }
.fin-pos { color: var(--gain); } .fin-neg { color: var(--loss); } .fin-zero { color: var(--text); } .fin-na { color: var(--muted); }
.fin-strong { font-weight: 700; } .fin-muted { color: var(--muted); }
/* Insignia de ESTADO de negocio: punto + texto, contorno; nunca verde/rojo. */
.status { display: inline-flex; align-items: center; gap: .35rem; padding: .1rem .55rem; border-radius: var(--radius-pill); font-size: var(--fs-xs);
  font-weight: 600; border: 1px solid transparent; white-space: nowrap; }
.status::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; }
.status-open { color: var(--st-open-fg); background: var(--st-open-bg); border-color: var(--st-open-bd); }
.status-closed { color: var(--st-closed-fg); background: var(--st-closed-bg); border-color: var(--st-closed-bd); }
.status-cancelled { color: var(--st-cancelled-fg); border-color: var(--st-cancelled-bd); border-style: dashed; }
.status-cancelled::before { background: transparent; border: 1px solid currentColor; }
.status-deleted { color: var(--st-deleted-fg); border-color: var(--st-deleted-bd); border-style: dashed; text-decoration: line-through; }
.status-deleted::before { background: transparent; border: 1px solid currentColor; }
.status-active { color: var(--st-closed-fg); background: var(--st-closed-bg); border-color: var(--st-closed-bd); }
.status-inactive { color: var(--st-cancelled-fg); border-color: var(--st-cancelled-bd); border-style: dashed; }
.status-inactive::before { background: transparent; border: 1px solid currentColor; }
/* Dirección de la operación (no es resultado: neutra). */
.dir { display: inline-flex; align-items: center; gap: .3rem; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .04em; color: var(--text-2); }
.dir-long::before { content: "▲"; font-size: .7em; } .dir-short::before { content: "▼"; font-size: .7em; }

/* Barra de filtros compacta */
.filterbar { display: grid; gap: var(--space-3) var(--space-4); grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); align-items: end; padding: var(--space-3) var(--space-4); }
.filterbar .filter-actions { display: flex; gap: var(--space-2); align-items: center; flex-wrap: wrap; }
.filterbar .check-inline { display: flex; align-items: center; gap: var(--space-2); min-height: 2.4rem; font-size: var(--fs-sm); }

/* Tabla de datos financieros */
.data-table { font-size: var(--fs-sm); }
.data-table th { background: var(--surface-2); border-bottom: 1px solid var(--border-strong); position: sticky; top: 0; z-index: 3; font-weight: 700; }
.data-table td { padding-block: var(--row-pad-y); vertical-align: middle; border-bottom: 1px solid var(--border); }
.data-table td.n, .data-table th.n { text-align: right; }
.data-table .cell-2 { display: flex; flex-direction: column; gap: 1px; line-height: 1.25; }
.data-table .cell-2 .sub { font-size: var(--fs-xs); color: var(--muted); }
.data-table .cell-2 .sub.trunc { max-width: 30ch; overflow: hidden; text-overflow: ellipsis; }
.data-table .num { font-family: var(--font-data); font-variant-numeric: tabular-nums; }
.op-row { position: relative; }
.op-row:hover { background: var(--surface-hover); }
.op-row.is-deleted { background: var(--surface-2); }
.op-row.is-deleted .num, .op-row.is-deleted .fin { opacity: .6; }
.row-link { color: var(--text); font-weight: 600; text-decoration: none; }
.row-link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.row-link:hover { color: var(--accent); }
.row-link:focus-visible { outline-offset: -2px; }
.op-row .row-actions, .op-card .row-actions { position: relative; z-index: 2; display: flex; gap: var(--space-3); align-items: center; justify-content: flex-end; }
.row-actions a { font-size: var(--fs-sm); font-weight: 600; text-decoration: none; }
.row-actions a:hover { text-decoration: underline; }
.row-actions form { margin: 0; }
.row-actions button.linklike { min-height: 0; padding: 0; border: 0; background: none; color: var(--accent); font-size: var(--fs-sm); font-weight: 600; }
.row-actions button.linklike:hover { text-decoration: underline; background: none; }
.row-actions .destructive { color: var(--text-2); }
.data-table-card { padding: 0; overflow: hidden; }

/* Tarjetas de operación (móvil) */
.op-cards { list-style: none; margin: 0; padding: 0; display: none; gap: var(--space-3); }
.op-card { position: relative; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: var(--space-3) var(--space-4); }
.op-card:hover { background: var(--surface-hover); }
.op-card.is-deleted { background: var(--surface-2); }
.op-card .card-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); }
.op-card .card-title { display: flex; align-items: baseline; gap: var(--space-2); flex-wrap: wrap; }
.op-card .sym { font-size: var(--fs-lg); font-weight: 700; }
.op-card .card-date { color: var(--muted); font-size: var(--fs-sm); margin-top: var(--space-1); }
.op-card .card-result { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); margin: var(--space-3) 0 var(--space-2); }
.op-card .card-pnl { font-size: var(--fs-xl); font-weight: 700; }
.op-card .card-r { font-size: var(--fs-md); font-weight: 600; }
.op-card dl { display: grid; grid-template-columns: max-content 1fr; gap: .15rem var(--space-4); margin: 0; font-size: var(--fs-sm); }
.op-card dt { color: var(--muted); } .op-card dd { margin: 0; text-align: right; }
.op-card .row-actions { margin-top: var(--space-3); padding-top: var(--space-2); border-top: 1px solid var(--border); justify-content: flex-start; }

/* ── 6 · RESPONSIVE ─────────────────────────────────────────────────────────────────────────────────────────────────── */
@media (max-width: 1199px) {
  .col-wide { display: none; }          /* tablet: costes, riesgo y duración pasan a la ficha y a la tarjeta; el R se mantiene */
  .data-table { --cell-pad-x: .5rem; }
  .data-table .cell-2 .sub.trunc { max-width: 15ch; }   /* vencimiento/cuenta se abrevian con «…» (texto completo en title); los importes NUNCA se abrevian */
  .page { padding: var(--space-3); }
}
@media (max-width: 759px) {
  .data-table-card { display: none; }   /* móvil: tarjetas, no una tabla comprimida */
  .op-cards { display: grid; }
  .page { padding: var(--space-3) var(--space-2); }
  .topbar { padding: var(--space-2) var(--space-3); gap: var(--space-2) var(--space-3); }
  .topbar nav a { padding: .4rem .6rem; }
  .page-header h1 { font-size: var(--fs-lg); }
  .page-header .actions { width: 100%; margin-left: 0; }
  .page-header .actions .button { flex: 1; }
  .filterbar { grid-template-columns: 1fr 1fr; }
  .filterbar .filter-actions { grid-column: 1 / -1; }
  /* el resto de pantallas (aún sin rediseñar) no deben desbordar la página */
  .section-grid { grid-template-columns: 1fr; }
  dl.kv { grid-template-columns: 1fr; gap: 0; } dl.kv dt { margin-top: var(--space-2); }
  .card, .table-wrap { max-width: 100%; }
  h1 { overflow-wrap: anywhere; }
  .inline-form input[name=name] { min-width: 0; flex: 1 1 10rem; }
  .big { font-size: var(--fs-xl); }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }
.data-table .cell-2.end { align-items: flex-end; }
.data-table .row-actions-cell { width: 1%; }

/* ── 7 · FICHA DE OPERACIÓN (Bloque 11) ─────────────────────────────────────────────────────────────────────────────── */
.back-link { font-size: var(--fs-sm); font-weight: 600; text-decoration: none; }
.back-link:hover { text-decoration: underline; }
.trade-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--space-3) var(--space-5); margin-top: var(--space-2); }
.th-id { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.th-title { margin: 0; display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--space-1) var(--space-3); font-size: var(--fs-2xl); line-height: 1.1; }
.th-sym { font-weight: 800; letter-spacing: -.01em; }
.th-exp { font-family: var(--font-data); font-size: var(--fs-md); font-weight: 500; color: var(--muted); }
.th-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); margin-top: var(--space-2); font-size: var(--fs-sm); color: var(--text-2); }
.th-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.th-actions form { margin: 0; }
.button.destructive { color: var(--err); border-color: var(--err); background: transparent; }
.button.destructive:hover { background: var(--err-bg); }
.notice { background: var(--warn-bg); color: var(--warn); border-radius: var(--radius); padding: .45rem .85rem; font-size: var(--fs-sm); }
.notice summary { cursor: pointer; font-weight: 600; list-style: none; }
.notice summary::-webkit-details-marker { display: none; }
.notice p { margin: var(--space-2) 0 0; }
.notice a { color: inherit; font-weight: 600; }
.result-panel { padding: var(--space-5); border-color: var(--border-strong); }
.result-body { display: grid; grid-template-columns: minmax(260px, 1fr) 2fr; gap: var(--space-5); align-items: center; }
.result-main { display: flex; flex-direction: column; gap: var(--space-4); }
.rm-block { display: flex; flex-direction: column; gap: var(--space-1); }
.metric-label { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.xxl .fin { font-size: var(--fs-3xl); line-height: 1.05; }
.xl .fin { font-size: var(--fs-2xl); line-height: 1.1; }
.metrics { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--space-4) var(--space-3); margin: 0; }
.metric { border-left: 2px solid var(--border); padding-left: var(--space-3); min-width: 0; }
.metric dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 700; }
.metric dd { margin: 2px 0 0; font-size: var(--fs-md); }
.result-note { margin: var(--space-3) 0 0; }
.data-cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
details.fold { padding: 0; }
details.fold > summary { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); cursor: pointer; list-style: none; }
details.fold > summary::-webkit-details-marker { display: none; }
details.fold > summary::before { content: "▸"; color: var(--muted); }
details.fold[open] > summary::before { content: "▾"; }
details.fold[open] > summary { border-bottom: 1px solid var(--border); }
.fold-title { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
details.fold > summary .tag { margin-left: 0; }
.fold-hint { margin-left: auto; font-size: var(--fs-sm); color: var(--muted); font-weight: 500; text-align: right; }
.fold-body { padding: var(--space-4); }
details.fold > summary:focus-visible, .notice summary:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; border-radius: var(--radius); }
@media (max-width: 899px) {
  .result-body { grid-template-columns: 1fr; gap: var(--space-4); }
  .result-main { flex-direction: row; flex-wrap: wrap; gap: var(--space-4) var(--space-5); }
}
@media (max-width: 759px) {
  .th-title { font-size: var(--fs-xl); }
  .th-actions { width: 100%; } .th-actions .button, .th-actions form, .th-actions button { flex: 1; width: 100%; }
  .result-panel { padding: var(--space-4); }
  .xxl .fin { font-size: 2.1rem; }
  .metrics { grid-template-columns: 1fr 1fr; }
  .data-cols { grid-template-columns: 1fr; gap: var(--space-4); }
  .fold-body { padding: var(--space-3); }
  .fold-hint { display: none; }
  .add-execution .field, .add-settlement .field { flex: 1 1 8rem; }
}
@media (max-width: 759px) {
  /* la ficha conserva pares etiqueta/valor en dos columnas (más compacta que apilar cada dato) */
  .data-cols dl.kv, .journal-cols dl.kv { grid-template-columns: minmax(6.5rem, max-content) 1fr; gap: .3rem var(--space-3); }
  .data-cols dl.kv dt, .journal-cols dl.kv dt { margin-top: 0; }
  .data-cols dl.kv dd, .journal-cols dl.kv dd { overflow-wrap: anywhere; }
}
/* Los textos solo para lectores de pantalla (.sr-only) son absolutos: sin un contenedor posicionado se «escapan» del overflow y ensanchan la página. */
.table-wrap, .data-table-card { position: relative; }

/* ── 8 · PERFORMANCE Y GRÁFICOS DE LA FICHA (Bloque 12) ────────────────────────────────────────────────────────────── */
.perf { padding: 0; overflow: hidden; box-shadow: var(--shadow-1); border-color: var(--hero-line); }
.perf-top { background: var(--hero-bg); color: var(--hero-text); padding: var(--space-5); position: relative; }
.perf-top::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--hero-line); }
.perf-top.tone-gain::before { background: var(--hero-gain); } .perf-top.tone-loss::before { background: var(--hero-loss); }
.perf-kicker { margin: 0 0 var(--space-4); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .08em; color: var(--hero-muted); font-weight: 700; }
.perf-top .tag { background: var(--hero-line); color: var(--hero-text); }
.perf-empty { margin: 0; color: var(--hero-muted); }
.perf-main { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-4) var(--space-6); }
.perf-key { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.perf-top .metric-label { color: var(--hero-muted); }
.perf-top .xxl .fin { font-size: var(--fs-4xl); line-height: 1; }
.perf-top .xl .fin { font-size: var(--fs-2xl); line-height: 1.05; }
.perf-top .fin-pos { color: var(--hero-gain); } .perf-top .fin-neg { color: var(--hero-loss); } .perf-top .fin-zero { color: var(--hero-text); }
.perf-top .fin-na, .perf-top .fin-muted { color: var(--hero-muted); }
.perf-top .note { color: var(--hero-muted); font-size: var(--fs-sm); }
.perf-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); margin: var(--space-5) 0 0; padding-top: var(--space-4); border-top: 1px solid var(--hero-line); }
.kpi { min-width: 0; }
.kpi dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--hero-muted); font-weight: 700; }
.kpi dd { margin: var(--space-1) 0 0; font-size: var(--fs-lg); font-weight: 600; }
.kpi-note { display: block; font-family: var(--font-ui); font-size: var(--fs-xs); font-weight: 400; color: var(--hero-muted); margin-top: 2px; line-height: 1.3; }
.perf-break { padding: var(--space-4) var(--space-5) var(--space-5); background: var(--surface); }
.perf-break .sub-title { margin-top: 0; }
.perf-break .metric-note, .perf-break .kpi-note { color: var(--muted); }
.perf-charts { background: var(--surface); box-shadow: var(--shadow-1); }
.charts-grid { display: grid; grid-template-columns: 2fr 1fr; gap: var(--space-5); align-items: start; }
.chart-card { min-width: 0; }
.chart-card .sub-title { margin-top: 0; }
.chart { display: block; width: 100%; height: auto; }
.chart-narrow { display: none; }
.chart-note { margin: var(--space-2) 0 0; }
.ct { font-family: var(--font-ui); font-size: 15px; fill: var(--muted); }
.ct-title { font-weight: 700; letter-spacing: .02em; fill: var(--text-2); }
.ct-net { font-family: var(--font-data); font-weight: 700; font-size: 17px; fill: var(--text); }
.ct-gain { fill: var(--gain); } .ct-loss { fill: var(--loss); } .ct-zero { fill: var(--text-2); }
.ct-end { font-family: var(--font-data); font-weight: 700; }
.c-panel { fill: var(--surface-2); stroke: var(--border); stroke-width: 1; }
.c-zero { stroke: var(--border-strong); stroke-width: 1; stroke-dasharray: 4 4; }
.c-line { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linejoin: round; }
.c-line-gain { stroke: var(--gain); } .c-line-loss { stroke: var(--loss); }
.c-dot { fill: var(--surface); stroke: var(--accent); stroke-width: 2; }
.c-buy { fill: var(--accent); } .c-sell { fill: var(--text-2); }
.c-axis { stroke: var(--border-strong); stroke-width: 2; }
.c-tick { stroke: var(--border-strong); stroke-width: 1; }
.c-tick-zero { stroke: var(--text-2); stroke-width: 2; }
.c-tick-stop { stroke: var(--warn); stroke-width: 3; }
.c-bar-gain { fill: var(--gain); opacity: .85; } .c-bar-loss { fill: var(--loss); opacity: .85; } .c-bar-zero { fill: var(--text-2); opacity: .6; }
.c-net { stroke: var(--surface); stroke-width: 3; fill: var(--text-2); }
.c-net-gain { fill: var(--gain); } .c-net-loss { fill: var(--loss); }
.c-gross { fill: var(--surface); stroke: var(--text-2); stroke-width: 2; }
.c-planned { fill: var(--accent); }
.rr-legend { list-style: none; margin: var(--space-2) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); font-size: var(--fs-sm); color: var(--text-2); }
.rr-legend .lg { display: inline-block; width: .7rem; height: .7rem; margin-right: .4rem; vertical-align: -1px; }
.lg-net { border-radius: 50%; background: var(--text-2); } .lg-gross { border: 2px solid var(--text-2); transform: rotate(45deg) scale(.85); }
.lg-planned { background: var(--accent); clip-path: polygon(50% 0, 0 100%, 100% 100%); } .lg-stop { width: .25rem; background: var(--warn); }
@media (max-width: 1199px) {
  .perf-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .charts-grid { grid-template-columns: 1fr; }
}
@media (max-width: 759px) {
  .perf-top { padding: var(--space-4); }
  .perf-top .xxl .fin { font-size: 2.5rem; }
  .perf-top .xl .fin { font-size: var(--fs-xl); }
  .perf-break { padding: var(--space-3) var(--space-4) var(--space-4); }
  .chart-wide { display: none; } .chart-narrow { display: block; }
}
.chart-rr { max-width: 480px; }

/* ── 9 · NUEVA / EDITAR OPERACIÓN (Bloque 13) ─────────────────────────────────────────────────────────────────────── */
.entry-header { margin-bottom: var(--space-3); }
.entry-layout { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); align-items: start; }
.entry-card { box-shadow: var(--shadow-1); display: flex; flex-direction: column; gap: var(--space-4); }
.step-title { display: flex; align-items: center; gap: var(--space-3); margin: 0; font-size: var(--fs-md); letter-spacing: .02em; }
.step { display: inline-flex; align-items: center; justify-content: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--accent); color: var(--on-accent);
  font-size: var(--fs-sm); font-weight: 700; }
.req { color: var(--accent); text-decoration: none; font-weight: 700; cursor: help; }
.opt { color: var(--muted); font-weight: 500; font-size: var(--fs-xs); text-transform: lowercase; }
.entry-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.entry-grid .span-2 { grid-column: span 2; }
.symbol-input { font-family: var(--font-data); font-size: var(--fs-lg); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; min-height: 2.9rem; }
.key-field input { border-color: var(--accent); }
.with-unit { display: flex; align-items: stretch; }
.with-unit input { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; min-width: 0; }
.unit { display: inline-flex; align-items: center; padding: 0 .7rem; border: 1px solid var(--border-strong); border-left: 0; border-radius: 0 var(--radius) var(--radius) 0;
  background: var(--surface-2); color: var(--muted); font-size: var(--fs-sm); font-weight: 500; }
.instrument-info:empty { display: none; }
.instrument-info .info, .instrument-info .warn, .instrument-info .alert { border: 1px solid var(--border); font-size: var(--fs-sm); }
.direction-field legend { margin-bottom: var(--space-1); }
.dir-seg label { flex: 0 1 11rem; }
.dir-seg span { padding: .7rem 1rem; font-weight: 700; letter-spacing: .04em; }
.dir-seg .arrow { font-size: .8em; margin-right: .25rem; }
.exec-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.exec-group { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-2); padding: var(--space-3) var(--space-4) var(--space-4);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); gap: var(--space-3); min-width: 0; align-content: start; }
.exec-group legend { padding: 0 var(--space-2); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--text-2); font-weight: 700; }
.risk-group { border-left: 3px solid var(--warn); }
.entry-res { padding: 0; overflow: hidden; box-shadow: var(--shadow-1); border-color: var(--hero-line); }
.entry-res .calc-panel { border: 0; padding: 0; background: transparent; border-radius: 0; }
.entry-res .perf-top { padding: var(--space-4) var(--space-5); }
.entry-res .perf-errors { margin: var(--space-2) 0 0; padding-left: 0; color: var(--hero-text); }
.entry-res .perf-errors li { padding: 2px 0; }
.entry-res .perf-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.entry-res .perf-break { padding: var(--space-3) var(--space-4) var(--space-4); }
.entry-res .metrics { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
.entry-res .perf-top .xxl .fin { font-size: var(--fs-3xl); }
.entry-journal { box-shadow: var(--shadow-1); }
.error-summary ul { margin: var(--space-1) 0 0; }
.error-summary a { color: inherit; font-weight: 700; }
.entry-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.entry-actions .primary { min-width: 12rem; }
@media (min-width: 1200px) {
  .entry-layout { grid-template-columns: minmax(0, 1.55fr) minmax(22rem, 1fr); grid-template-areas: "op res" "exec res" "journal res" "actions res"; }
  .entry-op { grid-area: op; } .entry-exec { grid-area: exec; } .entry-journal { grid-area: journal; } .entry-actions { grid-area: actions; }
  .entry-res { grid-area: res; position: sticky; top: var(--space-4); align-self: start; }
}
@media (max-width: 1199px) {
  .exec-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 759px) {
  .entry-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .entry-grid .span-2 { grid-column: 1 / -1; }
  .exec-groups { grid-template-columns: minmax(0, 1fr); }
  .entry-res .perf-top { padding: var(--space-4); }
  .entry-res .perf-top .xxl .fin { font-size: 2.25rem; }
  .dir-seg label { flex: 1; }
  .entry-actions .primary, .entry-actions .button, .entry-actions button { flex: 1 1 100%; }
}
.dir-seg span.arrow { display: inline; padding: 0; border: 0; background: none; color: inherit; font-size: .8em; margin-right: .25rem; }
.dir-seg input:checked + span span.arrow { background: none; }

/* ── 10 · CUENTA COMO «TRADING ACCOUNT» (Bloque 14) ───────────────────────────────────────────────────────────────── */
.account-perf { margin-bottom: var(--space-4); }
.account-empty { color: var(--hero-text); font-size: var(--fs-xl); font-weight: 700; letter-spacing: .04em; font-family: var(--font-ui); }
.hero-link { color: var(--hero-text); font-weight: 700; }
.chart-acc { max-width: 100%; }
.c-dot-gain { stroke: var(--gain); } .c-dot-loss { stroke: var(--loss); } .c-dot-zero { stroke: var(--text-2); }
.account-perf .perf-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199px) { .account-perf .perf-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 759px) { .account-empty { font-size: var(--fs-lg); } }

/* ── 11 · RENDIMIENTO TEMPORAL DE CUENTA (Bloque 15) ──────────────────────────────────────────────────────────────── */
.temporal { margin-top: var(--space-4); box-shadow: var(--shadow-1); display: flex; flex-direction: column; gap: var(--space-3); }
.temporal .section-title { margin: 0; }
.period-tabs { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.period-tab { padding: .45rem 1rem; border: 1px solid var(--border-strong); border-radius: var(--radius); text-decoration: none; color: var(--text-2); font-weight: 600; background: var(--surface); }
.period-tab.active { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.period-tab:focus-visible { outline: 3px solid var(--accent); outline-offset: 1px; }
.range-form { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: flex-end; }
.range-form .field { min-width: 9rem; }
.empty-note { margin: 0; padding: var(--space-4); background: var(--surface-2); border: 1px dashed var(--border-strong); border-radius: var(--radius); }
.temporal-table th[scope=row] { text-align: left; font-family: var(--font-data); font-weight: 600; white-space: nowrap; }
.row-na { background: var(--surface-2); }
.temporal-table td[colspan] { white-space: normal; text-align: left; }
.chart-per { max-width: 100%; }
.period-chart .chart-narrow { display: none; }
.c-pbar-gain { fill: var(--gain); } .c-pbar-loss { fill: var(--loss); } .c-pbar-zero { fill: var(--text-2); }
.c-pbar-na { fill: none; stroke: var(--muted); stroke-width: 2; stroke-dasharray: 3 3; }
@media (max-width: 759px) {
  .period-chart .chart-wide { display: none; } .period-chart .chart-narrow { display: block; }
  .period-tab { flex: 1 1 40%; text-align: center; }
  .temporal-table th, .temporal-table td { padding: .35rem .3rem; font-size: var(--fs-xs); white-space: normal; }
  .temporal-table td.n { white-space: nowrap; }
  .temporal-table th[scope=row] { white-space: nowrap; }
  .temporal-table th:nth-child(5), .temporal-table td:nth-child(5) { display: none; }  /* la rentabilidad por periodo queda en tablet/escritorio */
}
.temporal-table abbr { text-decoration: none; cursor: help; }

/* ── 12 · DASHBOARD V1 DE CUENTA (Bloque 16) ──────────────────────────────────────────────────────────────────────── */
.account-tabs { display: flex; gap: var(--space-1); border-bottom: 1px solid var(--border); margin: var(--space-2) 0 var(--space-4); }
.account-tab { padding: .55rem 1.1rem; text-decoration: none; color: var(--text-2); font-weight: 600; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.account-tab.active { color: var(--accent); border-bottom-color: var(--accent); }
.account-tab:focus-visible, .preset:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; }
.dash-period { color: var(--text-2); font-variant-numeric: tabular-nums; }
.dash-toolbar { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-5); align-items: flex-end; padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4);
  background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); }
.dash-presets { display: flex; gap: var(--space-1); }
.preset { padding: .45rem .9rem; border: 1px solid var(--border-strong); border-radius: var(--radius); text-decoration: none; color: var(--text-2); font-weight: 600; background: var(--surface); }
.preset.active { background: var(--text); color: var(--bg); border-color: var(--text); }
.dash { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); align-items: start; }
.dash-card { box-shadow: var(--shadow-1); display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.dash-card .section-title { margin: 0; }
.dash-hero { padding: 0; overflow: hidden; box-shadow: var(--shadow-1); border-color: var(--hero-line); }
.dash-hero .perf-top { padding: var(--space-5) var(--space-5) var(--space-5) calc(var(--space-5) + 4px); }
.dash-hero-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--space-5) var(--space-6); align-items: center; }
.dash-hero .xxl .fin { font-size: var(--fs-4xl); line-height: 1; }
.dash-state { color: var(--hero-text); font-weight: 700; letter-spacing: .04em; font-family: var(--font-ui); }
.dash-kpis { margin: 0; display: grid; gap: 0; border-left: 1px solid var(--hero-line); padding-left: var(--space-5); }
.dash-kpis > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-1) var(--space-3); align-items: baseline; padding: .55rem 0; border-bottom: 1px solid var(--hero-line); }
.dash-kpis > div:last-child { border-bottom: 0; }
.dash-kpis dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--hero-muted); font-weight: 700; }
.dash-kpis dd { margin: 0; text-align: right; font-size: var(--fs-lg); font-weight: 600; }
.dash-kpis .kpi-note { display: block; font-family: var(--font-ui); font-size: var(--fs-xs); font-weight: 400; color: var(--hero-muted); line-height: 1.3; }
.dash-hero .fin-pos { color: var(--hero-gain); } .dash-hero .fin-neg { color: var(--hero-loss); } .dash-hero .fin-zero { color: var(--hero-text); } .dash-hero .fin-na { color: var(--hero-muted); }
.dash-hero .note { color: var(--hero-muted); font-size: var(--fs-sm); }
.dash-nodata, .dash-empty .muted { margin: 0; }
.dash-empty { padding: var(--space-6) var(--space-5); background: var(--surface-2); border-style: dashed; text-align: center; align-items: center; }
.dash-empty-title { margin: 0; font-size: var(--fs-xl); letter-spacing: .05em; }
.dash-activity { margin: 0; }
.dash-na { border-left: 3px solid var(--border-strong); background: var(--surface-2); box-shadow: none; }
.dash-side { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.chart-pcur { max-width: 100%; }
.dash-curve .chart-narrow { display: none; }
.c-break { stroke: var(--muted); stroke-width: 2; stroke-dasharray: 3 4; }
@media (min-width: 1200px) {
  .dash { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); grid-template-areas: "hero hero" "tools tools" "equity equity" "curve curve" "bars side" "table table" "analysis analysis" "calendar calendar"; }
  .dash-hero { grid-area: hero; } .dash-tools { grid-area: tools; } .dash-equity { grid-area: equity; } .dash-curve { grid-area: curve; } .dash-bars { grid-area: bars; } .dash-table { grid-area: table; } .dash-analysis { grid-area: analysis; } .dash-calendar { grid-area: calendar; } .dash-side { grid-area: side; }
  .dash-empty { grid-column: 1 / -1; }
}
@media (max-width: 1199px) {
  .dash-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .dash-kpis { border-left: 0; padding-left: 0; border-top: 1px solid var(--hero-line); padding-top: var(--space-3); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-5); }
}
@media (max-width: 759px) {
  .dash-hero .perf-top { padding: var(--space-4); }
  .dash-hero .xxl .fin { font-size: 2.5rem; }
  .dash-kpis { grid-template-columns: minmax(0, 1fr); }
  .dash-curve .chart-wide { display: none; } .dash-curve .chart-narrow { display: block; }
  .dash-toolbar { padding: var(--space-3); gap: var(--space-3); }
  .dash-presets { width: 100%; } .preset { flex: 1; text-align: center; }
  .account-tab { flex: 1; text-align: center; }
}

/* ── 13 · CALENDARIO DE TRADING (Bloque 17) ───────────────────────────────────────────────────────────────────────── */
.dash-calendar { grid-column: 1 / -1; }
.cal-head { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-5); align-items: center; justify-content: space-between; }
.cal-nav { display: flex; align-items: center; gap: var(--space-3); }
.cal-month { min-width: 9rem; text-align: center; font-size: var(--fs-lg); letter-spacing: .02em; }
.cal-summary { margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3) var(--space-5); padding: var(--space-3) var(--space-4); background: var(--surface-2);
  border: 1px solid var(--border); border-radius: var(--radius); }
.cal-summary dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.cal-summary dd { margin: var(--space-1) 0 0; font-size: var(--fs-lg); font-weight: 600; }
table.cal { table-layout: fixed; width: 100%; border-collapse: separate; border-spacing: 4px; }
table.cal th { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding: var(--space-1) 0; text-align: center; }
table.cal abbr { text-decoration: none; cursor: help; }
.cal-pad { background: transparent; }
.cal-day { padding: 0; vertical-align: top; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); height: 5.25rem; }
.cal-in { display: flex; flex-direction: column; gap: 2px; height: 100%; padding: .35rem .45rem; color: var(--text); text-decoration: none; min-width: 0; overflow: hidden; }
a.cal-in:hover { background: var(--surface-hover); }
a.cal-in:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; border-radius: var(--radius); }
.cal-n { font-size: var(--fs-sm); font-weight: 700; color: var(--text-2); font-variant-numeric: tabular-nums; }
.cal-ops { font-size: var(--fs-xs); color: var(--text-2); }
.cal-ops abbr { text-decoration: none; }
.cal-pnl { font-family: var(--font-data); font-size: var(--fs-sm); font-weight: 700; white-space: nowrap; margin-top: auto; }
.cal-nd { font-size: var(--fs-xs); color: var(--warn); font-weight: 700; margin-top: auto; }
.cal-mark { display: none; font-size: var(--fs-sm); font-weight: 700; margin-top: auto; }
.cal-no_activity .cal-n { color: var(--muted); font-weight: 500; }
.cal-no_activity.is-future { background: var(--surface-2); }
.cal-positive { background: var(--ok-bg); border-color: var(--gain); }
.cal-negative { background: var(--err-bg); border-color: var(--loss); }
.cal-zero { background: var(--surface-2); border-color: var(--border-strong); border-style: double; }
.cal-unavailable { background: var(--warn-bg); border-color: var(--warn); border-style: dashed; }
.cal-day.is-selected { outline: 3px solid var(--accent); outline-offset: 1px; }
.cal-legend .lg-pos { color: var(--gain); font-weight: 700; } .cal-legend .lg-neg { color: var(--loss); font-weight: 700; } .cal-legend .lg-zero { color: var(--text-2); font-weight: 700; }
.cal-detail { border-top: 1px solid var(--border); padding-top: var(--space-3); display: flex; flex-direction: column; gap: var(--space-3); }
.cal-detail .sub-title { margin: 0; }
.closed-filter { margin: 0 0 var(--space-3); padding: var(--space-3) var(--space-4); }
@media (max-width: 1199px) { .cal-day { height: 4.5rem; } .cal-pnl { font-size: var(--fs-xs); } }
@media (max-width: 759px) {
  .cal-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  table.cal { border-spacing: 2px; }
  .cal-day { height: 3.6rem; }
  .cal-in { padding: .2rem .25rem; align-items: center; text-align: center; }
  .cal-ops { font-size: .75rem; } .cal-ops abbr { display: none; } .cal-pnl, .cal-nd { display: none; } .cal-mark { display: block; }
  .cal-nav { width: 100%; justify-content: space-between; } .cal-month { min-width: 0; }
}
.cal-nav .button { white-space: nowrap; }
@media (max-width: 759px) { .cal-nav .button { padding: .4rem .55rem; font-size: var(--fs-sm); } }

/* ── 14 · CAPITAL DE LA CUENTA (Bloque 18) ────────────────────────────────────────────────────────────────────────── */
.fin-flow { color: var(--text); font-weight: 600; }
.cap-hero .fin-flow, .perf-top .fin-flow { color: var(--hero-text); }
.cap { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); align-items: start; }
.cap-hero { padding: 0; overflow: hidden; box-shadow: var(--shadow-1); border-color: var(--hero-line); }
.cap-list, .cap-form { box-shadow: var(--shadow-1); display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.cap-list .section-title, .cap-form .section-title { margin: 0; }
.cap-table th[scope=row] { text-align: left; font-weight: 500; }
.cap-table tr.is-void { opacity: .6; } .cap-table tr.is-void .fin { text-decoration: line-through; }
.kind-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.kind input { position: absolute; opacity: 0; }
.kind { position: relative; display: block; }
.kind > span { display: flex; flex-direction: column; gap: 2px; padding: .55rem .7rem; border: 1px solid var(--border-strong); border-radius: var(--radius); cursor: pointer; background: var(--surface); }
.kind small { color: var(--muted); font-size: var(--fs-xs); }
.kind input:checked + span { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent); }
.kind input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: 1px; }
.cap-history { box-shadow: var(--shadow-1); }
.history li { padding: .35rem 0; border-bottom: 1px solid var(--border); }
@media (min-width: 1200px) {
  .cap { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); grid-template-areas: "hero hero" "list form" "hist hist"; }
  .cap-hero { grid-area: hero; } .cap-list { grid-area: list; } .cap-form { grid-area: form; position: sticky; top: var(--space-4); } .cap-history { grid-area: hist; }
}
@media (max-width: 759px) {
  .kind-list { grid-template-columns: minmax(0, 1fr); }
  .cap-table th, .cap-table td { padding: .4rem .35rem; }
  .cap-table .row-actions { flex-direction: column; gap: .15rem; align-items: flex-end; }
}
.cap-table .cell-2 { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; }
.cap-table .cell-2 .sub { font-size: var(--fs-xs); color: var(--muted); text-transform: none; letter-spacing: 0; font-weight: 400; }
.cap-table th[scope=row] .sub { white-space: normal; overflow-wrap: anywhere; }
.cap-table .row-actions { display: flex; gap: var(--space-3); white-space: nowrap; }
@media (max-width: 759px) {
  /* móvil: cada movimiento es una tarjeta de dos filas; fecha, tipo e IMPORTE siempre visibles (sin desplazamiento horizontal) */
  .cap-table thead { display: none; }
  .cap-table, .cap-table tbody { display: block; }
  .cap-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "date amount" "kind actions"; gap: .15rem .6rem; padding: .55rem .15rem; border-bottom: 1px solid var(--border); }
  .cap-table th[scope=row] { grid-area: date; padding: 0; } .cap-table td.n { grid-area: amount; padding: 0; align-self: start; font-size: var(--fs-md); }
  .cap-table td:nth-child(2) { grid-area: kind; padding: 0; } .cap-table td.row-actions-cell { grid-area: actions; padding: 0; align-self: end; }
  .cap-table .cell-2 .sub { display: block; }
}


/* ── 15 · EQUITY REALIZADA Y DRAWDOWN (Bloque 19) ─────────────────────────────────────────────────────────────────── */
.dash-equity { box-shadow: var(--shadow-1); }
.eq-state { margin: 0; }
.eq-kpis { margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3) var(--space-5); padding: var(--space-3) var(--space-4); background: var(--surface-2);
  border: 1px solid var(--border); border-radius: var(--radius); }
.eq-kpis > div { min-width: 0; }
.eq-kpis dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.eq-kpis dd { margin: var(--space-1) 0 0; font-size: var(--fs-lg); font-weight: 600; font-variant-numeric: tabular-nums; }
.eq-kpis .kpi-note { display: block; font-family: var(--font-ui); font-size: var(--fs-xs); font-weight: 400; color: var(--muted); line-height: 1.3; }
.eq-main dd { font-size: var(--fs-2xl); }
.eq-kpis .eq-main { grid-column: span 2; }
.eq-dd .fin-flow { color: var(--warn); }
.eq-note { margin: 0; padding: var(--space-3) var(--space-4); border-left: 3px solid var(--warn); background: var(--warn-bg); color: var(--text); border-radius: var(--radius); font-size: var(--fs-sm); }
.chart-eq { max-width: 100%; }
.dash-equity .chart-narrow { display: none; }
.c-eq-line { stroke: var(--accent); stroke-width: 2.5; }
.c-peak { fill: none; stroke: var(--muted); stroke-width: 1.5; stroke-dasharray: 5 4; }
.c-eq-dot { stroke-width: 2; fill: var(--surface); } .c-eq-gain { stroke: var(--gain); } .c-eq-loss { stroke: var(--loss); } .c-eq-zero { stroke: var(--text-2); }
.c-eq-flow { fill: var(--text-2); stroke: var(--surface); stroke-width: 1.5; }
.ct-eq { font-family: var(--font-data); font-weight: 700; font-size: 16px; fill: var(--text); }
.c-dd-area { fill: var(--warn); opacity: .22; stroke: none; }
.c-dd-line { fill: none; stroke: var(--warn); stroke-width: 2; }
.eq-table th[scope=row] { text-align: left; font-weight: 500; white-space: nowrap; font-variant-numeric: tabular-nums; }
.eq-table .cell-2 { display: flex; flex-direction: column; gap: 2px; }
.eq-table .cell-2 .sub { font-size: var(--fs-xs); color: var(--muted); }
.eq-table td.n { white-space: nowrap; }
@media (max-width: 1199px) {
  .eq-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .eq-table .col-peak, .eq-table .col-ddpct { display: none; }
}
@media (max-width: 759px) {
  .dash-equity .chart-wide { display: none; } .dash-equity .chart-narrow { display: block; }
  .eq-kpis { padding: var(--space-3); gap: var(--space-3); }
  .eq-kpis .eq-main { grid-column: 1 / -1; } .eq-main dd { font-size: var(--fs-xl); }
  .eq-table th, .eq-table td { padding: .35rem .3rem; font-size: var(--fs-xs); }
  .eq-table .col-effect { display: none; }
}


/* ── 16 · ESTADÍSTICA DE OPERACIONES (Bloque 20) ──────────────────────────────────────────────────────────────────── */
.dash-stats { box-shadow: var(--shadow-1); }
.stat-sample { margin: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.stat-kpis { margin: 0; display: grid; gap: var(--space-3) var(--space-5); padding: var(--space-3) var(--space-4); border: 1px solid var(--border); border-radius: var(--radius); min-width: 0; }
.stat-primary { grid-template-columns: repeat(6, minmax(0, 1fr)); background: var(--surface-2); }
.stat-secondary { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.stat-kpis > div { min-width: 0; }
.stat-kpis dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.stat-kpis dd { margin: var(--space-1) 0 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.stat-primary dd { font-size: var(--fs-xl); } .stat-secondary dd { font-size: var(--fs-lg); }
.stat-kpis .kpi-note { display: block; font-family: var(--font-ui); font-size: var(--fs-xs); font-weight: 400; color: var(--muted); line-height: 1.3; }
.stat-dist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.dist-block { min-width: 0; } .dist-block .sub-title { margin-top: 0; }
.dist { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2) var(--space-3); }
.dist > div { border-left: 2px solid var(--border); padding-left: var(--space-2); min-width: 0; }
.dist dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 700; }
.dist dd { margin: 2px 0 0; font-family: var(--font-data); font-size: var(--fs-md); font-variant-numeric: tabular-nums; white-space: nowrap; }
.stat-hist .sub-title { margin-top: 0; }
.chart-hist { max-width: 100%; }
.dash-stats .chart-narrow { display: none; }
.c-hist { stroke: none; } .c-hist-gain { fill: var(--gain); opacity: .85; } .c-hist-loss { fill: var(--loss); opacity: .85; } .c-hist-mix { fill: var(--text-2); opacity: .7; }
@media (max-width: 1199px) {
  .stat-primary, .stat-secondary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 759px) {
  .stat-primary, .stat-secondary { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: var(--space-3); gap: var(--space-3); }
  .stat-primary dd { font-size: var(--fs-lg); } .stat-secondary dd { font-size: var(--fs-md); }
  .stat-dist { grid-template-columns: minmax(0, 1fr); }
  .dash-stats .chart-wide { display: none; } .dash-stats .chart-narrow { display: block; }
}


/* ── 17 · SECUENCIA DE RESULTADOS (Bloque 21) ─────────────────────────────────────────────────────────────────────── */
.dash-seq { box-shadow: var(--shadow-1); }
.seq-now { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); }
.seq-label { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.seq-now-text, .seq-records .kpi-note { display: inline-flex; flex-wrap: wrap; gap: var(--space-1) var(--space-3); align-items: baseline; }
.seq-chip, .seq-item { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); font-family: var(--font-data); font-weight: 700; font-variant-numeric: tabular-nums; }
.seq-chip { padding: .15rem .55rem; font-size: var(--fs-md); } .seq-chip abbr { text-decoration: none; }
.seq-item { min-width: 1.9rem; height: 1.7rem; padding: 0 .3rem; font-size: .75rem; }
.seq-win { background: var(--ok-bg); border-color: var(--gain); color: var(--gain); }
.seq-loss { background: var(--err-bg); border-color: var(--loss); color: var(--loss); }
.seq-break_even { background: var(--surface-2); border-color: var(--text-2); border-style: dashed; color: var(--text-2); }
.seq { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 3px; }
.seq-start { margin-left: var(--space-3); } .seq-start:first-child { margin-left: 0; }
.seq-records { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3) var(--space-5); }
.seq-pnl-records { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.seq-records > div { border-left: 2px solid var(--border); padding-left: var(--space-3); min-width: 0; }
.seq-records dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.seq-records dd { margin: var(--space-1) 0 0; font-size: var(--fs-lg); font-weight: 600; font-variant-numeric: tabular-nums; }
.seq-big { font-family: var(--font-data); font-size: var(--fs-xl); }
.seq-block .sub-title { margin-top: 0; }
.seq-pnl-records .kpi-note { margin-left: var(--space-2); }
.seq-lengths { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); }
.trans-table th[scope=row] { text-align: left; font-weight: 600; }
.trans-table th[scope=row]::first-letter { text-transform: uppercase; }
.trans-table td.n { white-space: nowrap; }
@media (max-width: 1199px) { .seq-records { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 759px) {
  .seq-records, .seq-pnl-records { grid-template-columns: minmax(0, 1fr); }
  .seq-now { padding: var(--space-3); }
  .trans-table thead { display: none; }
  .trans-table, .trans-table tbody, .trans-table tr, .trans-table td, .trans-table th { display: block; }
  .trans-table tr { padding: .5rem 0; border-bottom: 1px solid var(--border); }
  .trans-table th[scope=row] { padding: .15rem 0; font-size: var(--fs-md); }
  .trans-table td.n { display: flex; justify-content: space-between; gap: var(--space-3); text-align: right; padding: .15rem 0; white-space: normal; }
  .trans-table td[data-label]::before { content: attr(data-label); color: var(--muted); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .05em; font-weight: 700; text-align: left; }
}

/* Liquidación real (Bloque C1): estado neutro (nunca verde/rojo), nota de separación P&L de operación ≠ importe liquidado, y aviso de cobertura en la cuenta. */
.settlement .settle-state { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); margin: 0 0 var(--space-2); }
.settlement .settle-note { margin: 0 0 var(--space-3); }
.settlement .add-settlement { align-items: flex-end; margin-top: var(--space-3); }
.settlement .add-settlement .field { flex: 1 1 9rem; }
.settle-coverage { margin: var(--space-3) 0; }
.settle-coverage ul { margin: var(--space-2) 0 0; }
.settlement .settle-item { border-top: 1px solid var(--border); padding-top: var(--space-3); margin-top: var(--space-2); }
.settlement .settle-item .kv { grid-template-columns: minmax(7.5rem, max-content) 1fr; gap: .3rem var(--space-4); margin: 0; }
.settlement .settle-item .kv dd { overflow-wrap: anywhere; }
.settlement .settle-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-top: var(--space-3); }

/* Liquidación de operaciones en la cuenta (Bloque C2): métricas y filas apilables (sin tabla: sin desbordamiento horizontal en móvil). */
.settle-panel { margin: var(--space-3) 0; }
.settle-panel .settle-state { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); margin: 0 0 var(--space-3); }
.settle-panel .settle-metrics .fin-line { display: block; }
.settle-rows { margin: var(--space-3) 0 0; padding: 0; list-style: none; }
.settle-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-4); padding: var(--space-2) 0; border-top: 1px solid var(--border); }
.settle-row .settle-id { min-width: 8rem; font-weight: 600; }
.settle-row .settle-kv { display: inline-flex; gap: var(--space-2); align-items: baseline; }
.settle-row .settle-badge { margin-left: auto; }
@media (max-width: 759px) { .settle-row .settle-badge { margin-left: 0; flex-basis: 100%; } }

/* Importación (Bloque C3): formulario, resumen, filtros y tabla de filas que pasa a tarjetas en móvil (sin desbordamiento horizontal de página). */
.imp-form { align-items: flex-end; gap: var(--space-3); }
.imp-form .field { flex: 1 1 12rem; }
.imp-form .imp-file { flex: 2 1 18rem; }
.imp-title .th-sym { overflow-wrap: anywhere; font-size: 1.6rem; }
.imp-warning, .imp-summary .warn { margin: var(--space-2) 0; }
.imp-metrics { grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); }
.imp-confirm { margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--border); display: grid; gap: var(--space-3); justify-items: start; }
.imp-confirm .check { display: flex; gap: var(--space-2); align-items: flex-start; font-size: var(--fs-sm); max-width: 60rem; }
.imp-rollback { margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--border); }
.imp-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: var(--space-2) 0 var(--space-3); }
.imp-table th[scope=row] { text-align: right; font-weight: 600; }
.imp-table .imp-reason { min-width: 14rem; }
.imp-table .imp-name, .imp-table .imp-file-cell { overflow-wrap: anywhere; }
.imp-table .imp-errors { margin: 0; padding-left: var(--space-4); color: var(--err); }
.imp-table .imp-warns { margin: var(--space-1) 0 0; padding-left: var(--space-3); }
@media (max-width: 759px) {
  .imp-table thead { display: none; }
  .imp-table, .imp-table tbody, .imp-table tr, .imp-table td, .imp-table th { display: block; }
  .imp-table tr { padding: .6rem 0; border-bottom: 1px solid var(--border); }
  .imp-table th[scope=row] { text-align: left; padding: .1rem 0; }
  .imp-table td { display: flex; justify-content: space-between; gap: var(--space-3); text-align: right; padding: .15rem 0; white-space: normal; overflow-wrap: anywhere; }
  .imp-table td[data-label]::before, .imp-table th[data-label]::before { content: attr(data-label); color: var(--muted); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .05em; font-weight: 700; text-align: left; flex: none; }
  .imp-table th[data-label] { display: flex; justify-content: space-between; }
  .imp-table .imp-reason { min-width: 0; }
}
@media (max-width: 759px) { .imp-table td.imp-empty { display: none; } }
.imp-table th.imp-lot[scope=row] { text-align: left; white-space: nowrap; }

/* C4: guía de la revisión (qué se importa y qué no) y botones de decisión sobre posibles duplicadas. */
.imp-guide { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; max-width: 60rem; }
.imp-guide li { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: baseline; font-size: var(--fs-sm); }
.imp-review { margin-top: var(--space-2); display: grid; gap: var(--space-2); justify-items: start; }
.imp-review .inline-form { margin: 0; }
@media (max-width: 759px) { .imp-review { justify-items: stretch; } .imp-review .inline-form button { flex: 1 1 100%; } }

/* C4: panel Data Readiness y franja de calidad de datos. El estado se dice con TEXTO y símbolo (✓ ℹ ⚠), no solo con color. */
.rd-state { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2) var(--space-3); margin: 0 0 var(--space-3); padding: var(--space-3); border: 1px solid var(--border); border-radius: var(--radius); }
.rd-state-label { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.rd-state strong { font-size: 1.15rem; letter-spacing: .02em; }
.rd-partial { border-color: var(--warn); } .rd-partial strong { color: var(--warn); }
.rd-list { margin: 0; padding: 0; list-style: none; }
.rd-item { display: grid; grid-template-columns: 11rem 1fr auto; gap: var(--space-1) var(--space-4); align-items: baseline; padding: var(--space-2) 0; border-top: 1px solid var(--border); }
.rd-label { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.rd-value { font-weight: 600; overflow-wrap: anywhere; }
.rd-symbol { font-size: 1.1rem; justify-self: end; }
.rd-warn .rd-symbol { color: var(--warn); }
.rd-detail { grid-column: 2 / -1; }
.rd-notes { display: grid; gap: var(--space-2); margin: 0; padding-left: var(--space-4); }
.rd-metrics { grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); }
.rd-strip { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-3); margin: var(--space-3) 0; padding: var(--space-2) var(--space-3); border: 1px solid var(--border); border-left-width: 4px; border-radius: var(--radius); background: var(--surface); }
.rd-strip.rd-partial { border-left-color: var(--warn); }
.rd-strip-title { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.rd-strip-note { flex-basis: 100%; }
.rd-strip-link { margin-left: auto; }
@media (max-width: 759px) { .rd-item { grid-template-columns: 1fr auto; } .rd-label { grid-column: 1 / -1; } .rd-detail { grid-column: 1 / -1; } .rd-strip-link { margin-left: 0; } }

/* C4: cuatro pestañas de cuenta caben en un móvil de 390 px (menos relleno y sin salto de línea; flex: 1 ya las reparte). */
@media (max-width: 480px) { .account-tab { padding: .55rem .35rem; min-width: 0; font-size: var(--fs-sm); } .account-tabs { gap: 0; } }

/* C4: en móvil la celda «Motivo» (texto + decisión + avisos) es un bloque, no una fila flex: si no, se aplasta en columnas de una letra. */
@media (max-width: 759px) {
  .imp-table td.imp-reason { display: block; text-align: left; }
  .imp-table td.imp-reason::before { display: block; margin-bottom: .2rem; }
  .imp-table td.imp-reason .imp-review { justify-items: stretch; }
}

/* ── 14 · CUENTA V1-01: jerarquía (identidad → hero con equity → actividad → evolución → calidad de datos → liquidaciones) ───────────────────────────── */
.acc-head .th-title { margin-bottom: 0; }
.acc-cta { min-height: 2.75rem; padding: 0 var(--space-5); font-weight: 700; }
.acc-edit { margin-left: var(--space-1); }
.acc-sub { font-weight: 500; text-transform: none; letter-spacing: 0; font-size: var(--fs-xs); opacity: .85; }
.acc-hero { margin-bottom: var(--space-3); }
.acc-hero .perf-top { padding-bottom: var(--space-4); }
.acc-hero .perf-kicker { margin-bottom: var(--space-3); }
.acc-hero .perf-main { margin-bottom: 0; }
.acc-hero .xxl .fin { font-size: var(--fs-4xl); }
.acc-empty-note { margin: var(--space-3) 0 0; }
.acc-empty-note .account-empty { display: block; font-size: var(--fs-lg); }
.acc-hero .acc-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: var(--space-4); padding-top: var(--space-3); }
.acc-hero .acc-kpis .kpi dd { font-size: var(--fs-lg); }
.acc-capital { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-5); margin: var(--space-3) 0 0; color: var(--hero-muted); }
.acc-capital strong { color: var(--hero-text); font-weight: 600; }
.acc-capital .acc-cap-k { text-transform: uppercase; letter-spacing: .05em; font-size: var(--fs-xs); font-weight: 700; margin-right: .25rem; }
.acc-capital .hero-link { margin-left: auto; font-weight: 600; }
.acc-capital .fin-pos, .acc-capital .fin-neg, .acc-capital .fin-zero, .acc-capital .fin-na { color: var(--hero-text); }
.acc-activity { margin: var(--space-3) 0; }
.acc-activity .section-title { margin: 0 0 var(--space-3); }
.acc-metrics { grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); }
.acc-act-cta { margin: var(--space-3) 0 0; color: var(--muted); }
.acc-quality { margin: var(--space-3) 0; }
.acc-quality .acc-liq { white-space: normal; }
.acc-settle-fold { margin: var(--space-3) 0; }
.acc-settle-fold .fold-body .settle-panel { border: 0; padding: 0; margin: 0; box-shadow: none; }
.acc-settle-fold .fold-body .settle-panel > h2 { display: none; }
.temporal { padding: 0; }
.temporal > details > summary { border-radius: var(--radius); }
.temporal-body { display: flex; flex-direction: column; gap: var(--space-3); }
/* Dashboard: tira de equity y drawdown dentro del hero compacto; barra de periodo y calidad de datos bajo el hero */
.dash-strip { margin: var(--space-4) 0 0; padding-top: var(--space-3); border-top: 1px solid var(--hero-line); display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); gap: var(--space-2) var(--space-5); align-items: start; }
.dash-strip dt { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--hero-muted); font-weight: 700; }
.dash-strip dd { margin: var(--space-1) 0 0; font-size: var(--fs-lg); font-weight: 600; }
.dash-strip .xl .fin { font-size: var(--fs-2xl); line-height: 1.05; }
.dash-strip .kpi-note { color: var(--hero-muted); }
.dash-strip .fin-flow, .dash-strip .fin-pos, .dash-strip .fin-neg, .dash-strip .fin-zero { color: var(--hero-text); }
.dash-strip .fin-na { color: var(--hero-muted); }
.dash-tools { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.dash-tools .dash-toolbar, .dash-tools .acc-quality { margin: 0; }
.dash-analysis { padding: 0; }
.dash-analysis > .fold-body { display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-3); }
.dash-analysis > .fold-body > .card { box-shadow: none; }
@media (max-width: 1199px) {
  .acc-hero .acc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 759px) {
  .acc-cta { width: 100%; }
  .acc-hero .perf-top { padding: var(--space-3) var(--space-4) var(--space-4); }
  .acc-hero .perf-kicker { margin-bottom: var(--space-2); }
  .acc-hero .xxl .fin { font-size: 2.25rem; }
  .acc-hero .acc-kpis { gap: var(--space-3) var(--space-3); margin-top: var(--space-3); }
  .acc-hero .acc-kpis .kpi dd { font-size: var(--fs-md); }
  .acc-capital .hero-link { margin-left: 0; flex-basis: 100%; }
  .dash-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
  .dash-strip .dash-strip-main { grid-column: 1 / -1; }
  .dash-strip .xl .fin { font-size: var(--fs-xl); }
  .dash-strip dd { font-size: var(--fs-md); }
  .dash-hero .perf-kicker { margin-bottom: var(--space-2); }
  .dash-hero .perf-kicker .tag { display: none; }
  .dash-hero .xxl .fin { font-size: 2rem; }
  .dash-hero .dash-kpis { grid-template-columns: minmax(0, 1fr); padding-top: var(--space-2); }
  .dash-hero .dash-kpis > div { grid-template-columns: minmax(0, 1fr); padding: .35rem 0; }
  .dash-hero .dash-kpis > div:nth-child(n+2) { display: none; }  /* operaciones, capital inicial y acumulado del rango siguen en la nota del P&L y en el bloque Equity */
  .dash-hero .dash-kpis dd { text-align: left; }
  .temporal-body { padding: var(--space-3); }
}

/* ── 16 · TREND & STRUCTURE — SISTEMA PREMIUM (B-02) ─────────────────────────────────────────────────────────────────── */
/* Marca provisional (tipográfica): sustituible por el logotipo definitivo cambiando solo .wm-mark / .wordmark. */
.wordmark { display: inline-flex; align-items: center; gap: .65rem; text-decoration: none; color: var(--nav-text-strong); font-family: var(--font-display); font-weight: 700;
  letter-spacing: .16em; text-transform: uppercase; font-size: .84rem; line-height: 1.1; }
.wm-mark { flex: none; width: 1.3rem; height: 1.3rem; background:
  linear-gradient(var(--gold), var(--gold)) 0 100% / 26% 38% no-repeat,
  linear-gradient(var(--gold), var(--gold)) 50% 100% / 26% 70% no-repeat,
  linear-gradient(var(--gold), var(--gold)) 100% 100% / 26% 100% no-repeat; }
.wm-amp { color: var(--gold); font-style: italic; text-transform: none; letter-spacing: 0; }
.wm-text { white-space: nowrap; }

/* Menú lateral */
.sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-4) var(--space-3);
  background: var(--nav-bg); color: var(--nav-text); border-right: 1px solid var(--nav-line); z-index: 60; }
.sb-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); padding: var(--space-1) var(--space-2) var(--space-3); border-bottom: 1px solid var(--nav-line); }
.sb-cta { display: flex; align-items: center; justify-content: center; min-height: 2.75rem; border-radius: var(--radius); background: var(--nav-cta-bg); color: var(--nav-cta-fg);
  font-weight: 700; text-decoration: none; letter-spacing: .01em; }
.sb-cta:hover { filter: brightness(1.07); }
.sb-nav { display: flex; flex-direction: column; gap: var(--space-4); flex: 1; }
.sb-group { display: flex; flex-direction: column; gap: 2px; }
.sb-label { margin: 0 0 var(--space-1); padding: 0 var(--space-3); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--nav-muted); }
.sb-nav a { display: block; padding: .5rem var(--space-3); border-radius: var(--radius-sm); border-left: 2px solid transparent; color: var(--nav-text); font-size: var(--fs-sm); font-weight: 500; text-decoration: none; }
.sb-nav a:hover { color: var(--nav-text-strong); background: var(--nav-bg-2); }
.sb-nav a[aria-current=page] { color: var(--nav-text-strong); background: var(--nav-active-bg); border-left-color: var(--gold); font-weight: 600; }
.sb-account { margin: var(--space-1) 0 var(--space-1) var(--space-2); padding: var(--space-2); border: 1px solid var(--nav-line); border-radius: var(--radius); background: var(--nav-bg-2); display: flex; flex-direction: column; gap: 2px; }
.sb-acc-name { display: block; color: var(--nav-text-strong); font-weight: 700; font-size: var(--fs-sm); padding: 0 var(--space-2); overflow-wrap: anywhere; }
.sb-acc-cur { display: block; color: var(--nav-muted); font-size: var(--fs-xs); letter-spacing: .1em; padding: 0 var(--space-2) var(--space-1); }
.sb-foot { display: flex; flex-direction: column; gap: 2px; padding: var(--space-3) var(--space-2) 0; border-top: 1px solid var(--nav-line); font-size: var(--fs-xs); color: var(--nav-muted); }
.sb-env { font-weight: 700; letter-spacing: .08em; color: var(--nav-text); }
.sb-user strong { color: var(--nav-text-strong); font-weight: 600; }
.sb-logout { margin: var(--space-2) 0 0; }
.sb-logout-btn { width: 100%; min-height: 2.5rem; background: transparent; border: 1px solid var(--nav-line); color: var(--nav-text); font-size: var(--fs-sm); }
.sb-logout-btn:hover { background: var(--nav-bg-2); color: var(--nav-text-strong); border-color: var(--nav-muted); }
.sidebar a:focus-visible, .sidebar button:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
.icon-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 2.75rem; min-height: 2.75rem; padding: 0; border-radius: var(--radius); background: transparent; border: 1px solid transparent; color: inherit; font-size: 1.5rem; line-height: 1; }
.icon-btn:hover { background: var(--surface-hover); }
.sidebar .icon-btn:hover { background: var(--nav-bg-2); }
.burger, .burger::before, .burger::after { display: block; width: 1.15rem; height: 2px; background: currentColor; border-radius: 2px; content: ""; }
.burger { position: relative; } .burger::before { position: absolute; top: -6px; } .burger::after { position: absolute; top: 6px; }
.backdrop { position: fixed; inset: 0; z-index: 55; background: rgba(8, 9, 12, .6); opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.nav-toggle, .sb-close { display: none; }

/* Barra superior */
.topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: var(--space-3) var(--space-4); min-height: 3.5rem; padding: .35rem var(--space-5);
  background: var(--surface-elevated); border-bottom: 1px solid var(--border); box-shadow: var(--shadow-1); }
.wordmark-sm { display: none; color: var(--text); }
.crumbs { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.crumb-kicker { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.crumb-title { font-weight: 700; font-size: var(--fs-md); letter-spacing: -.01em; }
.ctx-account { display: inline-flex; align-items: center; gap: var(--space-2); padding: .3rem .8rem; border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--surface-2); min-width: 0; }
.ctx-label { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.ctx-name { font-size: var(--fs-sm); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 18ch; }
.ctx-cur { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; color: var(--text-2); }
.topbar-right { margin-left: auto; display: flex; align-items: center; gap: var(--space-3); }
.env-pill { display: inline-flex; align-items: center; gap: .45rem; padding: .28rem .75rem; border-radius: var(--radius-pill); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .14em; border: 1px solid var(--accent); color: var(--accent); background: transparent; }
.env-dot { width: .5rem; height: .5rem; border-radius: 50%; background: currentColor; flex: none; }
.env-pill-demo { color: var(--warn); background: var(--warn-bg); border: 1px dashed var(--warn); }
.env-chip { display: inline-flex; align-items: center; gap: .35rem; font-size: var(--fs-xs); font-weight: 800; letter-spacing: .12em; color: var(--accent); }
.env-chip-demo { color: var(--warn); }
.user-menu { position: relative; }
.um-btn { display: inline-flex; align-items: center; gap: var(--space-2); min-height: 2.5rem; padding: 0 var(--space-2) 0 .3rem; border: 1px solid var(--border); border-radius: var(--radius-pill); cursor: pointer; list-style: none; background: var(--surface); }
.um-btn:hover { background: var(--surface-hover); }
.um-panel[hidden] { display: none; }
.avatar { display: inline-flex; align-items: center; justify-content: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: var(--btn-bg); color: var(--btn-fg); font-weight: 700; font-size: var(--fs-sm); }
.um-name { font-size: var(--fs-sm); font-weight: 600; padding-right: var(--space-1); }
.um-panel { position: absolute; right: 0; top: calc(100% + .5rem); width: 17rem; padding: var(--space-4); background: var(--surface-elevated); border: 1px solid var(--border-strong); border-radius: var(--radius-lg); box-shadow: var(--shadow-2); z-index: 40; }
.um-panel p { margin: 0 0 var(--space-2); } .um-id { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); } .um-meta { color: var(--muted); }
.um-panel form { margin: var(--space-3) 0 0; border-top: 1px solid var(--border); padding-top: var(--space-3); }

/* Escritorio ancho: menú lateral permanente. Por debajo (tableta y móvil) el menú es un cajón. */
@media (min-width: 1280px) {
  .sb-close, .nav-toggle, .backdrop { display: none; }
}
@media (max-width: 1279px) {
  body.has-shell { display: block; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: min(86vw, 320px); transform: translateX(-104%); visibility: hidden; transition: transform .22s ease, visibility 0s linear .22s; box-shadow: var(--shadow-2); }
  body.nav-open .sidebar { transform: none; visibility: visible; transition: transform .22s ease; }
  body.nav-open .backdrop { opacity: 1; pointer-events: auto; }
  html:not(.js) .sidebar { position: static; width: auto; height: auto; transform: none; visibility: visible; box-shadow: none; }
  html:not(.js) .backdrop { display: none; }
  .nav-toggle, .sb-close { display: inline-flex; }
  .wordmark-sm { display: inline-flex; }
  .topbar { padding: .35rem var(--space-3); }
  .page { padding: var(--space-4) var(--space-4) var(--space-6); }
}
@media (max-width: 759px) {
  .crumbs { display: none; }
  .ctx-account { display: none; }
  .um-name { display: none; }
  .um-btn { padding: 0 .3rem; }
  .wordmark-sm .wm-text { font-size: .8rem; letter-spacing: .12em; }
  .page { padding: var(--space-3) var(--space-3) var(--space-6); }
  .topbar-right { gap: var(--space-2); }
}
@media (min-width: 760px) and (max-width: 1279px) { .ctx-account { display: none; } }

/* ── Tipografía financiera y jerarquía de texto ── */
.fin { font-family: var(--font-financial); font-variant-numeric: tabular-nums lining-nums; font-feature-settings: "tnum" 1, "lnum" 1; letter-spacing: -.012em; font-weight: 600; }
.xxl .fin, .xl .fin { font-weight: 650; letter-spacing: -.025em; }
.fin-strong { font-weight: 700; }
.num, .data-table .num { font-family: var(--font-financial); font-variant-numeric: tabular-nums lining-nums; letter-spacing: -.01em; }
.th-title, h1 { font-weight: 700; }

/* ── Cabecera de página, tarjetas y paneles ── */
.page-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-3) var(--space-5); padding-bottom: var(--space-4); border-bottom: 1px solid var(--border); }
.ph-kicker { margin: 0 0 var(--space-1); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); }
.ph-title { margin: 0; font-size: var(--fs-2xl); letter-spacing: -.025em; line-height: 1.1; }
.ph-sub { margin: var(--space-2) 0 0; color: var(--muted); font-size: var(--fs-sm); max-width: 62ch; }
.ph-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-1); }
.section-title { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-1) var(--space-2); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--text-2); }
.section-title::before { content: ""; flex: none; width: .9rem; height: 2px; background: var(--gold); border-radius: 2px; }
.sub-title { color: var(--text-2); font-weight: 700; }
.tag { background: var(--accent-soft); color: var(--accent-strong); letter-spacing: .08em; }
.flash { background: var(--surface-elevated); color: var(--text); border: 1px solid var(--border); border-left: 4px solid var(--gain); box-shadow: var(--shadow-1); font-weight: 600; border-radius: var(--radius); }
.alert { background: var(--err-bg); color: var(--err); border: 1px solid var(--err); border-left-width: 4px; }
.warn { border: 1px solid var(--warn); border-left-width: 4px; }
.info { border: 1px solid var(--border); }
.notice { border: 1px solid var(--warn); border-left-width: 4px; }
.back-link { color: var(--muted); letter-spacing: .02em; }
.back-link:hover { color: var(--accent); }

/* ── Botones: primario (grafito / oro en oscuro), secundario, fantasma, destructivo, icono ── */
button, .button { border-radius: var(--radius); background: var(--surface-elevated); border: 1px solid var(--border-strong); min-height: 2.5rem; font-weight: 600; letter-spacing: .005em; transition: background .12s ease, border-color .12s ease, box-shadow .12s ease; }
button:hover, .button:hover { background: var(--surface-hover); border-color: var(--text-2); }
button.primary, .button.primary { background: var(--btn-bg); border-color: var(--btn-bg); color: var(--btn-fg); box-shadow: var(--shadow-1); }
button.primary:hover, .button.primary:hover { background: var(--btn-bg-hover); border-color: var(--btn-bg-hover); }
button.ghost, .button.ghost { background: transparent; border-color: transparent; color: var(--accent); }
button.ghost:hover, .button.ghost:hover { background: var(--accent-soft); border-color: transparent; }
button.danger { background: var(--loss); border-color: var(--loss); color: var(--surface-elevated); }
.ghost-link { color: var(--accent); font-weight: 600; font-size: var(--fs-sm); text-decoration: none; padding: .35rem .5rem; border-radius: var(--radius-sm); }
.ghost-link:hover { background: var(--accent-soft); }
.seg input:checked + span { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
.period-tab.active { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
.preset.active { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
.step { background: var(--btn-bg); color: var(--btn-fg); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }

/* ── Formularios ── */
.field > span, legend { color: var(--text-2); font-weight: 600; font-size: var(--fs-sm); letter-spacing: .01em; }
input:not([type=radio]):not([type=checkbox]), select, textarea { min-height: 2.6rem; padding: .45rem .7rem; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--surface-elevated); color: var(--text); transition: border-color .12s ease, box-shadow .12s ease; }
input:not([type=radio]):not([type=checkbox]):hover, select:hover, textarea:hover { border-color: var(--text-2); }
input:not([type=radio]):not([type=checkbox]):focus, select:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); outline: none; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: none; }
select { appearance: none; padding-right: 2.2rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23777' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .8rem center; }
input[type=checkbox], input[type=radio] { accent-color: var(--accent); width: 1.05rem; height: 1.05rem; }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: .8; }
.err { color: var(--err); font-weight: 600; }
[aria-invalid=true] { border-color: var(--loss) !important; box-shadow: 0 0 0 3px var(--err-bg); }
.help, .hint { color: var(--muted); font-size: var(--fs-sm); }
.filterbar { background: var(--surface-2); border-radius: var(--radius-lg); box-shadow: none; }
.form-block { gap: var(--space-3); }
.form-block + .form-block { border-top: 1px solid var(--border); }

/* ── Tablas (sistema común) ── */
.data-table th, table th { background: var(--surface-2); color: var(--muted); font-weight: 700; letter-spacing: .08em; }
.data-table-card { border-radius: var(--radius-lg); }
.data-table td, table td { border-bottom-color: var(--border); }
table tbody tr:hover { background: var(--surface-hover); }
.table-wrap { border-radius: var(--radius); }
.op-card { border-radius: var(--radius-lg); box-shadow: var(--shadow-1); }
.op-card .card-pnl { font-weight: 650; letter-spacing: -.02em; }
.badge { background: var(--info-bg); color: var(--text-2); letter-spacing: .04em; }
.badge.unverified { background: var(--warn-bg); color: var(--warn); } .badge.verified { background: var(--ok-bg); color: var(--ok); }
.status-open { color: var(--st-open-fg); background: var(--st-open-bg); border-color: var(--st-open-bd); }

/* ── Hero financiero: grafito con hilo de oro ── */
.perf { border-radius: var(--radius-lg); box-shadow: var(--shadow-2); border-color: var(--hero-line); }
.perf-top { border-top: 2px solid var(--gold); }
.perf-top::before { width: 4px; }
.perf-kicker { letter-spacing: .14em; }
.perf-top .tag { background: rgba(201, 162, 75, .16); color: var(--hero-text); }
.perf-top .xxl .fin { font-weight: 600; letter-spacing: -.03em; }
.metric { border-left-color: var(--gold); }
.kpi dd, .dash-kpis dd { font-family: var(--font-financial); }

/* ── Estados vacíos ── */
.empty-state { text-align: center; padding: var(--space-7) var(--space-5); background: var(--surface); border: 1px dashed var(--border-strong); border-radius: var(--radius-lg); display: flex; flex-direction: column; align-items: center; gap: var(--space-2); }
.es-kicker { margin: 0; font-size: var(--fs-xs); font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); }
.es-title { margin: 0; font-size: var(--fs-xl); letter-spacing: -.02em; }
.es-text { margin: 0 0 var(--space-3); color: var(--muted); max-width: 52ch; }
.empty-note { background: var(--surface-2); border: 1px dashed var(--border-strong); border-radius: var(--radius); }

/* ── Cuentas: selector de libros ── */
.acct-grid { list-style: none; margin: var(--space-4) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: var(--space-4); }
.acct-card { position: relative; display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5); background: var(--surface); border: 1px solid var(--border); border-top: 2px solid var(--gold); border-radius: var(--radius-lg); box-shadow: var(--shadow-1); transition: box-shadow .15s ease, transform .15s ease; }
.acct-card:hover { box-shadow: var(--shadow-2); transform: translateY(-1px); }
.ac-top { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); }
.ac-type, .ac-cur { font-size: var(--fs-xs); font-weight: 800; letter-spacing: .14em; color: var(--muted); text-transform: uppercase; }
.ac-top .status { margin-left: auto; }
.ac-name { margin: 0; font-size: var(--fs-xl); letter-spacing: -.02em; line-height: 1.15; }
.ac-name a { color: var(--text); text-decoration: none; }
.ac-name a:hover { color: var(--accent); }
.ac-name a::after { content: ""; position: absolute; inset: 0; border-radius: var(--radius-lg); }
.ac-notes { margin: calc(var(--space-2) * -1) 0 0; color: var(--muted); }
.ac-figures { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3) var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--border); }
.ac-figures > div { min-width: 0; }
.ac-figures dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ac-figures dd { margin: 2px 0 0; font-size: var(--fs-md); }
.ac-main { grid-column: 1 / -1; }
.ac-main dd { font-size: var(--fs-2xl); letter-spacing: -.03em; line-height: 1.1; }
.ac-main dd .fin { font-weight: 650; }
.ac-actions { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-top: auto; padding-top: var(--space-2); }
.ac-actions .primary { margin-right: auto; }

/* ── Inicio de sesión ── */
.bare .page { max-width: none; padding: 0; }
.bare .flash { display: none; }
.bare .main { min-height: 100vh; }
.login { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); min-height: 100vh; }
.login-brand { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; gap: var(--space-6); padding: clamp(2rem, 5vw, 4.5rem); color: var(--nav-text-strong);
  background: var(--nav-bg); background-image: repeating-linear-gradient(0deg, transparent 0 63px, rgba(255, 255, 255, .035) 63px 64px), repeating-linear-gradient(90deg, transparent 0 63px, rgba(255, 255, 255, .035) 63px 64px); }
.lb-top { display: flex; align-items: center; gap: var(--space-3); position: relative; z-index: 1; }
.wm-mark-lg { width: 2.1rem; height: 2.1rem; }
.lb-wordmark { margin: 0; font-family: var(--font-display); font-weight: 700; letter-spacing: .22em; text-transform: uppercase; font-size: 1.05rem; }
.lb-body { position: relative; z-index: 1; max-width: 34rem; }
.lb-kicker { margin: 0 0 var(--space-3); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .26em; text-transform: uppercase; color: var(--gold); }
.lb-title { margin: 0; font-family: var(--font-display); font-size: clamp(2rem, 3.6vw, 3.1rem); line-height: 1.12; font-weight: 700; letter-spacing: -.01em; }
.lb-points { list-style: none; margin: var(--space-5) 0 0; padding: 0; display: grid; gap: var(--space-2); color: var(--nav-text); font-size: var(--fs-base); }
.lb-points li { padding-left: var(--space-4); border-left: 2px solid var(--gold); }
.lb-points span { color: var(--nav-text-strong); font-weight: 700; }
.lb-chart { position: absolute; left: 0; right: 0; bottom: 3.2rem; width: 100%; height: 38%; opacity: .5; pointer-events: none; }
.lb-chart polyline { fill: none; stroke: var(--gold); stroke-width: 2; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.lb-foot { position: relative; z-index: 1; margin: 0; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--nav-muted); }
.login-panel { display: flex; align-items: center; justify-content: center; padding: var(--space-6) var(--space-5); background: var(--bg); }
.lp-card { width: 100%; max-width: 26rem; padding: var(--space-6); background: var(--surface-elevated); border: 1px solid var(--border); border-top: 2px solid var(--gold); border-radius: var(--radius-lg); box-shadow: var(--shadow-2); }
.lp-kicker { margin: 0 0 var(--space-1); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); }
.lp-title { margin: 0 0 var(--space-4); font-size: var(--fs-2xl); letter-spacing: -.025em; }
.lp-form { display: flex; flex-direction: column; gap: var(--space-4); }
.lp-submit { min-height: 3rem; font-size: var(--fs-md); letter-spacing: .06em; text-transform: uppercase; font-weight: 700; }
.lp-help { margin: var(--space-4) 0 0; color: var(--muted); }
.lp-alert { margin: 0 0 var(--space-4); padding: .75rem .9rem; border-radius: var(--radius); border: 1px solid var(--border-strong); border-left-width: 4px; font-size: var(--fs-sm); background: var(--surface-2); }
.lp-alert-error { border-color: var(--err); background: var(--err-bg); color: var(--err); }
.lp-alert-locked { border-color: var(--warn); background: var(--warn-bg); color: var(--warn); }
.lp-alert-info { border-color: var(--accent); background: var(--accent-soft); color: var(--text); }
@media (max-width: 899px) {
  .login { grid-template-columns: 1fr; min-height: 0; }
  .login-brand { padding: var(--space-5) var(--space-4); gap: var(--space-3); }
  .lb-points, .lb-chart, .lb-foot { display: none; }
  .lb-title { font-size: 1.55rem; }
  .lb-kicker { margin-bottom: var(--space-2); }
  .login-panel { align-items: flex-start; padding: var(--space-5) var(--space-3) var(--space-6); }
  .lp-card { padding: var(--space-5) var(--space-4); }
}

/* ── Páginas de aviso y error ── */
.error-page { max-width: 36rem; margin: var(--space-6) auto; padding: var(--space-6) var(--space-5); text-align: center; background: var(--surface); border: 1px solid var(--border); border-top: 2px solid var(--gold); border-radius: var(--radius-lg); box-shadow: var(--shadow-1); display: flex; flex-direction: column; align-items: center; gap: var(--space-2); }
.err-code { margin: 0; font-family: var(--font-display); font-size: 4.5rem; line-height: 1; font-weight: 700; color: var(--border-strong); letter-spacing: .04em; }
.err-code:empty { display: none; }
.err-kicker { margin: 0; font-size: var(--fs-xs); font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); }
.err-title { margin: 0; font-size: var(--fs-xl); letter-spacing: -.02em; }
.err-message { margin: 0 0 var(--space-3); color: var(--muted); max-width: 44ch; }

/* ── Datos: calidad (centro de estado), importación (flujo) y catálogo ── */
.rd-state { border-radius: var(--radius-lg); border-left-width: 4px; background: var(--surface-2); }
.rd-partial { border-color: var(--warn); } .rd-complete { border-color: var(--gain); } .rd-ready-for-data { border-color: var(--st-open-fg); }
.rd-item { border-top-color: var(--border); }
.rd-ok .rd-symbol { color: var(--ok); } .rd-info .rd-symbol { color: var(--st-open-fg); }

/* Reducción de movimiento y contraste forzado */
@media (prefers-reduced-motion: reduce) { .sidebar, .backdrop, .acct-card { transition: none !important; } .acct-card:hover { transform: none; } }
@media (forced-colors: active) { .env-pill, .status, .acct-card, .lp-card { border: 1px solid CanvasText; } }

/* ── 16b · Ajustes de composición (B-02) ─────────────────────────────────────────────────────────────────────────────── */
.th-id { color: var(--accent); letter-spacing: .16em; }
.th-title { letter-spacing: -.025em; }
.account-tabs { border-bottom-color: var(--border-strong); }
.account-tab { font-weight: 600; letter-spacing: .01em; }
.account-tab.active { color: var(--text); border-bottom-color: var(--gold); border-bottom-width: 3px; }
.account-tab:hover { color: var(--accent); }
/* Con el menú lateral permanente el contenido es más estrecho: las columnas secundarias de la tabla de operaciones se ocultan antes */
@media (max-width: 1599px) { .col-wide { display: none; } }
@media (max-width: 480px) {
  .topbar { gap: var(--space-2); }
  .wordmark-sm { min-width: 0; }
  .wordmark-sm .wm-text { font-size: var(--fs-xs); letter-spacing: .06em; }
  .wordmark-sm .wm-mark { width: 1.05rem; height: 1.05rem; }
  .topbar-right { margin-left: auto; flex: none; }
  .env-pill { padding: .22rem .55rem; letter-spacing: .08em; }
}

/* Flujo de importación */
.flow { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.flow-step { flex: 1 1 8rem; display: flex; align-items: center; gap: var(--space-2); padding: .6rem .8rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-2); color: var(--muted); font-size: var(--fs-sm); font-weight: 600; }
.flow-n { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; border: 1px solid var(--border-strong); font-size: var(--fs-xs); font-weight: 800; }
.flow-step.is-done { color: var(--text-2); } .flow-step.is-done .flow-n { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-strong); }
.flow-step.is-current { background: var(--surface-elevated); border-color: var(--accent); color: var(--text); box-shadow: var(--shadow-1); }
.flow-step.is-current .flow-n { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
@media (max-width: 759px) { .flow-step { flex: 1 1 calc(50% - var(--space-2)); } .flow-l { overflow: hidden; text-overflow: ellipsis; } }

/* Calidad de datos: banner de estado */
.rd-banner { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4) var(--space-5); border: 1px solid var(--border-strong); border-left-width: 5px; border-radius: var(--radius-lg); background: var(--surface-2); }
.rd-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; border: 2px solid currentColor; font-size: 1.25rem; font-weight: 800; }
.rd-banner-text { display: flex; flex-direction: column; gap: 2px; }
.rd-banner strong { font-size: var(--fs-xl); letter-spacing: -.01em; }
.rd-banner.rd-partial { color: var(--warn); background: var(--warn-bg); border-color: var(--warn); }
.rd-banner.rd-complete { color: var(--ok); background: var(--ok-bg); border-color: var(--ok); }
.rd-banner.rd-ready-for-data { color: var(--st-open-fg); background: var(--st-open-bg); border-color: var(--st-open-bd); }
.rd-banner .rd-state-label { color: inherit; opacity: .85; }
.rd-banner strong, .rd-banner .muted { color: var(--text); }

/* Tablas que se convierten en tarjetas en móvil (data-label en cada celda) */
@media (max-width: 759px) {
  table.rtable thead { display: none; }
  table.rtable, table.rtable tbody, table.rtable tr, table.rtable td { display: block; width: 100%; }
  table.rtable tr { padding: var(--space-3) var(--space-3); border-bottom: 1px solid var(--border-strong); }
  table.rtable td { display: flex; justify-content: space-between; gap: var(--space-3); padding: .2rem 0; border: 0; white-space: normal; text-align: right; }
  table.rtable td::before { content: attr(data-label); flex: none; color: var(--muted); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; text-align: left; }
}
input[type=file] { padding: .3rem; min-height: 2.6rem; }
input[type=file]::file-selector-button { margin-right: var(--space-3); padding: .4rem .9rem; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface-2); color: var(--text); font: inherit; font-weight: 600; cursor: pointer; }
input[type=file]::file-selector-button:hover { background: var(--surface-hover); }
.rd-item.rd-warn { background: var(--warn-bg); border-radius: var(--radius-sm); padding-inline: var(--space-3); border-top-color: transparent; }
.rd-item.rd-warn .rd-label { color: var(--warn); }
.op-row .fin-strong { font-size: var(--fs-base); font-weight: 700; }
.op-row .col-wide, .op-row .num { color: var(--text-2); }
.data-table th.n:nth-last-child(3), .data-table th.n:nth-last-child(2) { color: var(--text-2); }
/* Móvil: la tarjeta de operación prioriza P&L y R; lo secundario (vencimiento, costes, riesgo, duración) queda en la ficha */
@media (max-width: 759px) {
  .op-card dl > :nth-child(n+5) { display: none; }
  .op-card .card-pnl { font-size: var(--fs-2xl); }
  /* Un elemento de rejilla no baja de su contenido mínimo: sin esto, «entrada → salida» ensanchaba la tarjeta más que la pantalla */
  .op-cards > li { min-width: 0; }
  .op-card dl { grid-template-columns: max-content minmax(0, 1fr); }
  .op-card dd { overflow-wrap: anywhere; }
}
@media (max-width: 430px) { .wordmark-sm { gap: .4rem; } .wordmark-sm .wm-text { display: none; } .topbar-right { margin-left: var(--space-2); } }

/* ── 18 · PERFORMANCE V2 (P0): hero → equity dominante → periodos → calidad → rachas/extremos → activos → costes → anual ── */
.pf-scope-chip { display: inline-flex; align-items: center; padding: .15rem .6rem; border: 1px solid var(--accent); border-radius: var(--radius-pill); color: var(--accent); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; }
.pf-toolbar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3) var(--space-4); margin: var(--space-3) 0; padding: var(--space-3) var(--space-4); background: var(--surface-2); box-shadow: none; }
.pf-seg { display: inline-flex; margin: 0; padding: 0; border: 1px solid var(--border-strong); border-radius: var(--radius); overflow: hidden; align-self: flex-end; }
.pf-seg-opt { position: relative; display: inline-flex; margin: 0; cursor: pointer; }
.pf-seg-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pf-seg-opt span { display: inline-flex; align-items: center; min-height: 2.6rem; padding: 0 var(--space-4); font-weight: 600; font-size: var(--fs-sm); color: var(--text-2); border-left: 1px solid var(--border); }
.pf-seg-opt:first-of-type span { border-left: 0; }
.pf-seg-opt input:checked + span { background: var(--btn-bg); color: var(--btn-fg); }
.pf-seg-opt input:focus-visible + span { outline: 3px solid var(--accent); outline-offset: -3px; }
.pf-f { display: flex; flex-direction: column; gap: var(--space-1); margin: 0; min-width: 8.5rem; }
.pf-apply { min-height: 2.6rem; padding: 0 var(--space-5); }
.pf-hero { margin: var(--space-3) 0; box-shadow: var(--shadow-2); }
.pf-hero .perf-top { border-top: 2px solid var(--gold); padding: var(--space-5) var(--space-6) var(--space-4); }
.pf-hero .perf-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-4); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--hero-muted); }
.pf-hero-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.6fr); gap: var(--space-5) var(--space-6); align-items: start; }
.pf-value { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.pf-value .xxl .fin { font-size: var(--fs-4xl); line-height: 1; letter-spacing: -.035em; }
.pf-value-parts { margin: var(--space-2) 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2) var(--space-4); }
.pf-value-parts dt, .pf-kpi dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--hero-muted); }
.pf-value-parts dd { margin: 2px 0 0; font-size: var(--fs-md); color: var(--hero-text); }
.pf-kpis { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-5); padding-left: var(--space-5); border-left: 1px solid var(--hero-line); }
.pf-kpi { min-width: 0; }
.pf-kpi dd { margin: var(--space-1) 0 0; font-size: var(--fs-2xl); line-height: 1.1; color: var(--hero-text); }
.pf-kpi dd .fin-flow { color: var(--hero-text); }
.pf-tagline { display: inline-block; margin-left: .3rem; padding: 0 .4rem; border-radius: var(--radius-sm); background: var(--accent-soft); color: var(--accent-strong); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .04em; text-transform: none; }
.perf-top .pf-tagline { background: var(--hero-line); color: var(--hero-text); }
.pf-why { display: block; margin-top: 2px; font-family: var(--font-ui); font-size: var(--fs-xs); font-weight: 400; line-height: 1.35; color: var(--muted); letter-spacing: 0; }
.perf-top .pf-why { color: var(--hero-muted); }
.pf-flag { display: inline-block; padding: 0 .4rem; border-radius: var(--radius-sm); background: var(--warn-bg); color: var(--warn); font-size: var(--fs-xs); font-weight: 700; }
.pf-flows { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-5); margin: var(--space-4) 0 0; padding-top: var(--space-3); border-top: 1px solid var(--hero-line); color: var(--hero-muted); }
.pf-flows strong { color: var(--hero-text); font-weight: 600; font-family: var(--font-financial); }
.pf-flows-note { margin-left: auto; }
.pf-sec-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-2) var(--space-4); margin: 0 0 var(--space-3); }
.pf-sec-head .section-title, .pf-sec-head p { margin: 0; }
.pf-equity, .pf-months, .pf-edge, .pf-moments, .pf-assets, .pf-costs, .pf-annual, .pf-elig { margin: var(--space-4) 0; padding: var(--space-4) var(--space-5); }
.pf-elig { padding: 0; }
.pf-equity { padding: var(--space-5) var(--space-6); border-top: 2px solid var(--gold); }
.pf-legend { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin: 0; color: var(--text-2); }
.pf-legend .lg::before { content: ""; display: inline-block; width: 1.1rem; height: 0; margin-right: .4rem; vertical-align: middle; border-top: 3px solid var(--accent); }
.pf-legend .lg-cap::before { border-top: 2px dotted var(--text-2); }
.pf-legend .lg-peak::before { border-top: 2px dashed var(--muted); }
.pf-legend .lg-dd::before { border-top: 6px solid var(--warn); opacity: .5; }
.pf-legend .lg-flow::before { display: none; }
.c-capital { fill: none; stroke: var(--text-2); stroke-width: 1.6; stroke-dasharray: 2 4; }
.pf-equity .chart-narrow { display: none; }
.pf-dd-strip { margin: var(--space-4) 0 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--space-3) var(--space-5); padding: var(--space-3) var(--space-4); background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); }
.pf-dd-strip dt, .pf-cost-grid dt, .pf-cons dt, .pf-elig-grid dt, .pf-list dt, .pf-edge-k dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.pf-dd-strip dd, .pf-cost-grid dd, .pf-elig-grid dd { margin: var(--space-1) 0 0; font-size: var(--fs-lg); font-weight: 600; }
.pf-dd-strip .fin-flow { color: var(--warn); }
.pf-dd-state { display: inline-flex; padding: .1rem .55rem; border-radius: var(--radius-pill); font-size: var(--fs-sm); font-weight: 700; border: 1px solid var(--border-strong); color: var(--text-2); background: var(--surface); }
.pf-dd-new_high, .pf-dd-recovered { color: var(--ok); background: var(--ok-bg); border-color: var(--ok); }
.pf-dd-in_drawdown { color: var(--warn); background: var(--warn-bg); border-color: var(--warn); }
.pf-dd-recovering { color: var(--st-open-fg); background: var(--st-open-bg); border-color: var(--st-open-bd); }
.pf-charts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-5); }
.pf-chart { margin: 0; min-width: 0; }
.pf-chart .chart-narrow { display: none; }
.pf-chart figcaption { margin-bottom: var(--space-2); }
.pf-grid-title { margin: var(--space-5) 0 var(--space-2); }
.pf-grid-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--border); border-radius: var(--radius); }
.pf-grid { width: 100%; min-width: 52rem; border-collapse: collapse; font-size: var(--fs-sm); }
.pf-grid th { padding: .45rem .4rem; text-align: center; font-size: var(--fs-xs); }
.pf-grid tbody th { text-align: left; padding-left: var(--space-3); background: var(--surface-2); }
.pf-cell { padding: .4rem .35rem; text-align: center; vertical-align: middle; border-left: 1px solid var(--border); }
.pf-cell .fin { display: block; font-size: var(--fs-sm); }
.pf-cell-pnl { display: block; color: var(--muted); font-size: var(--fs-xs); font-family: var(--font-financial); font-variant-numeric: tabular-nums; }
.pf-pos { background: var(--ok-bg); } .pf-neg { background: var(--err-bg); }
.pf-cell-year { background: var(--surface-2); font-weight: 700; }
.pf-method { margin-left: .25rem; font-size: var(--fs-xs); font-weight: 700; color: var(--accent); text-decoration: none; border-bottom: 1px dotted var(--accent); }
.pf-fold { margin-top: var(--space-4); }
.pf-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.pf-table th, .pf-table td { padding: var(--row-pad-y) var(--cell-pad-x); border-bottom: 1px solid var(--border); vertical-align: top; }
.pf-table thead th { font-size: var(--fs-xs); text-transform: uppercase; vertical-align: bottom; }
.pf-table tbody th { text-align: left; font-weight: 600; white-space: nowrap; }
.pf-table .num { text-align: right; white-space: nowrap; }
.pf-sample { display: inline-block; margin-left: .3rem; padding: 0 .45rem; border-radius: var(--radius-pill); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .02em; border: 1px solid var(--border-strong); color: var(--text-2); background: var(--surface-2); white-space: nowrap; }
.pf-sample-limited { color: var(--warn); background: var(--warn-bg); border-color: var(--warn); }
.pf-sample-data { color: var(--ok); background: var(--ok-bg); border-color: var(--ok); }
.pf-edge-grid { margin: 0 0 var(--space-4); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.pf-edge-k { padding: var(--space-3) var(--space-4); border: 1px solid var(--border); border-left: 3px solid var(--gold); border-radius: var(--radius); background: var(--surface-elevated); min-width: 0; }
.pf-edge-k dd { margin: var(--space-1) 0 0; font-size: var(--fs-2xl); font-weight: 650; line-height: 1.1; }
.pf-edge-k dd .pf-why .fin { font-size: var(--fs-xs); }
.pf-edge-more { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--space-5); }
.pf-mini { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.pf-mini th, .pf-mini td { padding: .3rem .5rem; border-bottom: 1px solid var(--border); }
.pf-mini tbody th { text-align: left; font-weight: 500; color: var(--text-2); }
.pf-mini .num { text-align: right; white-space: nowrap; }
.pf-hist .chart-narrow { display: none; }
.pf-cons { margin: 0; display: grid; gap: var(--space-2); }
.pf-cons dd { margin: 2px 0 0; font-size: var(--fs-md); font-weight: 600; }
.pf-moments-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3) var(--space-6); }
.pf-list { margin: 0; display: flex; flex-direction: column; }
.pf-list > div { display: grid; grid-template-columns: minmax(9rem, .8fr) minmax(0, 1.6fr); gap: var(--space-3); align-items: baseline; padding: .55rem 0; border-bottom: 1px solid var(--border); }
.pf-list dt { align-self: center; }
.pf-list dd { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-2); }
.pf-list .pf-why { display: inline; margin: 0; }
.pf-outcome { display: inline-flex; padding: 0 .5rem; border-radius: var(--radius-sm); font-family: var(--font-data); font-weight: 700; font-size: var(--fs-sm); border: 1px solid var(--border-strong); }
.pf-o-win { color: var(--gain); border-color: var(--gain); } .pf-o-loss { color: var(--loss); border-color: var(--loss); } .pf-o-break_even { color: var(--text-2); }
.pf-cost-grid, .pf-elig-grid { margin: 0 0 var(--space-3); display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: var(--space-3) var(--space-5); }
.pf-elig-list { margin: var(--space-2) 0; padding-left: var(--space-5); display: flex; flex-direction: column; gap: var(--space-1); font-size: var(--fs-sm); }
@media (max-width: 1199px) {
  .pf-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .pf-kpis { padding-left: 0; padding-top: var(--space-4); border-left: 0; border-top: 1px solid var(--hero-line); }
  .pf-edge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pf-edge-more, .pf-moments-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 759px) {
  .pf-toolbar { padding: var(--space-3); }
  .pf-seg { width: 100%; } .pf-seg-opt { flex: 1; } .pf-seg-opt span { width: 100%; justify-content: center; padding: 0 var(--space-2); }
  .pf-f { flex: 1 1 calc(50% - var(--space-3)); min-width: 0; }
  .pf-apply { width: 100%; }
  .pf-hero .perf-top { padding: var(--space-4); }
  .pf-value .xxl .fin { font-size: 2.4rem; }
  .pf-kpi dd { font-size: var(--fs-xl); }
  .pf-kpis { gap: var(--space-3); }
  .pf-flows-note { margin-left: 0; flex-basis: 100%; }
  .pf-equity, .pf-months, .pf-edge, .pf-moments, .pf-assets, .pf-costs, .pf-annual { padding: var(--space-3); }
  .pf-equity .chart-wide, .pf-chart .chart-wide, .pf-hist .chart-wide { display: none; }
  .pf-equity .chart-narrow, .pf-chart .chart-narrow, .pf-hist .chart-narrow { display: block; }
  .pf-charts { grid-template-columns: minmax(0, 1fr); }
  .pf-edge-k dd { font-size: var(--fs-xl); }
  .pf-list > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .pf-table tbody th { white-space: normal; }
  table.rtable.pf-table tr { padding: var(--space-2) 0; }
  table.rtable.pf-table th[scope=row] { display: block; padding: 0 0 var(--space-1); border: 0; font-size: var(--fs-md); }
}
@media (max-width: 420px) { .pf-kpis { grid-template-columns: minmax(0, 1fr); } .pf-edge-grid { grid-template-columns: minmax(0, 1fr); } .pf-value-parts { grid-template-columns: minmax(0, 1fr); } }
/* Selector de periodo: solo los campos de la opción elegida (navegadores sin :has() muestran todos) */
.pf-toolbar:has(input[value=all]:checked) .pf-f-year, .pf-toolbar:has(input[value=all]:checked) .pf-f-month, .pf-toolbar:has(input[value=all]:checked) .pf-f-range,
.pf-toolbar:has(input[value=year]:checked) .pf-f-month, .pf-toolbar:has(input[value=year]:checked) .pf-f-range,
.pf-toolbar:has(input[value=month]:checked) .pf-f-year, .pf-toolbar:has(input[value=month]:checked) .pf-f-range,
.pf-toolbar:has(input[value=range]:checked) .pf-f-year, .pf-toolbar:has(input[value=range]:checked) .pf-f-month { display: none; }
.pf-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 480px) { .account-tabs { gap: 0; } .account-tab { flex: 1 1 auto; padding: .55rem .2rem; font-size: var(--fs-xs); } }
.pf-bw span { display: block; white-space: nowrap; } .pf-dd-note { margin: var(--space-2) 0 0; }
/* D-61 · dos zonas: valor de la cuenta (dinero) y rendimiento del trading (neutral a movimientos de capital) */
.pf-zone { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.pf-zone-t { margin: 0 0 var(--space-1); display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); font-size: var(--fs-sm); font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--hero-text); }
.pf-zone-t::before { content: ""; width: .9rem; height: 2px; background: var(--gold); align-self: center; }
.pf-zone-en { font-size: var(--fs-xs); font-weight: 600; letter-spacing: .06em; color: var(--hero-muted); }
.pf-zone-account .xxl .fin { font-size: var(--fs-4xl); line-height: 1; letter-spacing: -.035em; }
.pf-zone-perf { padding-left: var(--space-5); border-left: 1px solid var(--hero-line); }
.pf-zone-perf .pf-kpis { padding-left: 0; border-left: 0; }
.pf-sec-sub { margin: 0 0 var(--space-3); max-width: 80ch; }
.pf-perf { border-top-color: var(--accent); }
.c-perf-line { stroke: var(--gain); stroke-width: 2.5; }
.c-tdd-area { fill: var(--loss); opacity: .16; } .c-tdd-line { stroke: var(--loss); }
.pf-legend .lg-perf::before { border-top-color: var(--gain); }
.pf-perf .pf-legend .lg-dd::before { border-top-color: var(--loss); }
.pf-perf .chart-narrow { display: none; }
@media (max-width: 1199px) { .pf-zone-perf { padding-left: 0; padding-top: var(--space-4); border-left: 0; border-top: 1px solid var(--hero-line); } }
@media (max-width: 759px) { .pf-zone-account .xxl .fin { font-size: 2.4rem; } .pf-perf .chart-wide { display: none; } .pf-perf .chart-narrow { display: block; } }
/* ── 19 · B-04 · PRODUCTO COMPLETO: Inicio, tarjeta de cuenta, usuario, calendario, instrumentos, errores (solo tokens) ── */
.ac-note { display: block; font-size: var(--fs-xs); color: var(--muted); font-weight: 500; letter-spacing: 0; }
.ac-top .status { margin-left: 0; }
.rd-chip { margin-left: auto; display: inline-flex; align-items: center; padding: .1rem .55rem; border-radius: var(--radius-pill); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .04em; border: 1px solid var(--border-strong); color: var(--text-2); background: var(--surface-2); }
.rd-chip-partial { color: var(--warn); background: var(--warn-bg); border-color: var(--warn); }
.rd-chip-complete { color: var(--ok); background: var(--ok-bg); border-color: var(--ok); }
.rd-chip-ready-for-data { color: var(--st-open-fg); background: var(--st-open-bg); border-color: var(--st-open-bd); }
.home-hero { margin: 0 0 var(--space-4); box-shadow: var(--shadow-2); }
.home-hero-top { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-4) var(--space-6); border-top: 2px solid var(--gold); padding: var(--space-6); }
.home-id { min-width: 0; max-width: 46rem; }
.home-hero .perf-kicker { margin: 0 0 var(--space-2); font-size: var(--fs-xs); font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--hero-muted); }
.home-title { margin: 0; font-family: var(--font-display); font-size: var(--fs-3xl); letter-spacing: -.02em; color: var(--hero-text); line-height: 1.05; }
.home-sub { margin: var(--space-2) 0 0; color: var(--hero-muted); max-width: 60ch; }
.home-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.home-actions .button:not(.primary) { background: transparent; color: var(--hero-text); border-color: var(--hero-line); }
.home-actions .button:not(.primary):hover { background: var(--hero-line); }
.home-actions .button.primary { background: var(--nav-cta-bg); border-color: var(--nav-cta-bg); color: var(--nav-cta-fg); }
.home-sec-head { margin-top: var(--space-4); }
.home-steps { text-align: left; margin: 0 0 var(--space-3); padding-left: var(--space-5); color: var(--text-2); display: flex; flex-direction: column; gap: var(--space-1); }
.home-data { margin: var(--space-4) 0; padding: var(--space-4) var(--space-5); }
.home-attention { list-style: none; margin: var(--space-2) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.home-attention li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-3); padding: var(--space-2) 0; border-top: 1px solid var(--border); }
.home-attention .rd-chip { margin-left: 0; }
.home-note { flex-basis: 100%; }
.me-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-4); }
.me-card { padding: var(--space-4) var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); }
.me-wide { grid-column: 1 / -1; }
.me-kv { margin: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.me-kv dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.me-kv dd { margin: 2px 0 0; }
.me-accounts { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--space-2); }
.um-link { margin: 0 0 var(--space-2); } .um-link a { font-weight: 600; }
.cal-pick { list-style: none; margin: var(--space-4) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--space-3); }
.cal-pick-item { display: flex; flex-direction: column; gap: var(--space-1); padding: var(--space-4); text-decoration: none; color: var(--text); border-top: 2px solid var(--gold); }
.cal-pick-item:hover { box-shadow: var(--shadow-2); }
.cal-page { margin: var(--space-3) 0; padding: var(--space-4) var(--space-5); }
.list-sub { margin: 0 0 var(--space-3); }
.ins-state { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin: var(--space-3) 0; padding: var(--space-3) var(--space-4); border-radius: var(--radius); }
.ins-verified { border: 1px solid var(--ok); border-left-width: 4px; background: var(--ok-bg); color: var(--text); }
.ins-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.ins-card { padding: var(--space-4) var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); }
.ins-kv { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3) var(--space-4); }
.ins-kv dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.ins-kv dd { margin: 2px 0 0; overflow-wrap: anywhere; }
.ins-kv-strong dd { font-size: var(--fs-xl); font-weight: 650; }
.err-context { margin: 0; } .err-context code { font-family: var(--font-data); overflow-wrap: anywhere; }
@media (max-width: 759px) {
  .home-hero-top { padding: var(--space-4); }
  .home-title { font-size: var(--fs-2xl); }
  .home-actions { width: 100%; } .home-actions .button { flex: 1 1 auto; justify-content: center; }
  .me-grid, .ins-grid { grid-template-columns: minmax(0, 1fr); }
  .ins-kv { grid-template-columns: minmax(0, 1fr); }
  .account-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .account-tab { padding: .55rem .2rem; font-size: var(--fs-xs); text-align: center; }
  .cal-page { padding: var(--space-3); }
}

/* ── 20 · B-05 · ANÁLISIS AL FRENTE: Resumen como centro de análisis, Análisis como laboratorio, mini-panel de cuenta. Solo tokens. ── */
.rs-hero { margin: var(--space-3) 0; }
.rs-hero-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2) var(--space-4); }
.rs-hero-head .perf-kicker { margin: 0 0 var(--space-3); } .rs-hero-head .rd-chip { margin-left: auto; }
.rs-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.9fr); gap: var(--space-5) var(--space-6); align-items: start; }
.rs-value { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.rs-value .xxl .fin { font-size: var(--fs-4xl); line-height: 1; letter-spacing: -.035em; }
.rs-sub, .rs-kpis, .rs-activity, .rs-perf-facts { margin: 0; display: grid; gap: var(--space-3) var(--space-5); }
.rs-sub { margin-top: var(--space-3); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rs-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); padding-left: var(--space-5); border-left: 1px solid var(--hero-line); }
.rs-sub dt, .rs-kpi dt, .rs-activity dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--hero-muted); }
.rs-sub dd, .rs-kpi dd, .rs-activity dd { margin: var(--space-1) 0 0; color: var(--hero-text); min-width: 0; }
.rs-kpi dd { font-size: var(--fs-xl); line-height: 1.15; } .rs-kpi dd .fin-flow { color: var(--hero-text); }
.rs-kpi .pf-sample { display: block; margin-top: 2px; }
.rs-activity { grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--hero-line); }
.rs-activity dd { font-family: var(--font-financial); font-weight: 600; }
.rs-empty { margin: var(--space-4) 0; } .rs-empty .account-empty { color: var(--warn); font-size: var(--fs-md); }
.rs-equity, .rs-perf, .rs-months, .an-cum, .an-capital, .an-risk, .an-dim { padding: var(--space-4) var(--space-5); margin: var(--space-4) 0; }
.rs-placeholder { display: flex; flex-direction: column; justify-content: center; gap: var(--space-1); min-height: 9rem; padding: var(--space-4); border: 1px dashed var(--border-strong); border-radius: var(--radius); background: var(--surface-2); }
.rs-ph-title { font-weight: 700; color: var(--text-2); }
.rs-perf-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: var(--space-4) var(--space-5); align-items: start; }
.rs-perf-facts { grid-template-columns: minmax(0, 1fr); padding: var(--space-3) var(--space-4); background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius); }
.rs-perf-facts dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.rs-perf-facts dd { margin: 2px 0 0; font-size: var(--fs-lg); font-weight: 600; } .rs-perf-facts .fin-flow { color: var(--warn); }
.mg { position: relative; }
.mg-r { position: absolute; opacity: 0; pointer-events: none; }
.mg-switch { display: inline-flex; margin: 0 0 var(--space-3); border: 1px solid var(--border-strong); border-radius: var(--radius-pill); overflow: hidden; }
.mg-l { padding: .3rem .9rem; font-size: var(--fs-sm); font-weight: 700; cursor: pointer; color: var(--text-2); }
.mg-r-pct:checked ~ .mg-switch .mg-l-pct, .mg-r-amt:checked ~ .mg-switch .mg-l-amt { background: var(--btn-bg); color: var(--btn-fg); }
.mg-r:focus-visible ~ .mg-switch { outline: 2px solid var(--accent); outline-offset: 2px; }
.mg-r-pct:checked ~ .mg-wrap .mg-v-amt, .mg-r-amt:checked ~ .mg-wrap .mg-v-pct { display: none; }
.mg-wrap { border: 1px solid var(--border); border-radius: var(--radius); }
.mg-table { width: 100%; min-width: 50rem; border-collapse: collapse; font-size: var(--fs-sm); font-family: var(--font-financial); }
.mg-table th { padding: .45rem .35rem; font-size: var(--fs-xs); text-align: center; color: var(--muted); }
.mg-table tbody th { text-align: left; color: var(--text); }
.mg-cell { padding: .5rem .35rem; text-align: center; border-top: 1px solid var(--border); white-space: nowrap; }
.mg-pos { color: var(--pos); background: var(--ok-bg); } .mg-neg { color: var(--neg); background: var(--err-bg); }
.mg-total { font-weight: 700; border-left: 1px solid var(--border-strong); }
.rs-extremes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); margin: var(--space-4) 0; }
.rs-x { padding: var(--space-4) var(--space-5); border-left: 4px solid var(--border-strong); }
.rs-x-gain { border-left-color: var(--gain); } .rs-x-loss { border-left-color: var(--loss); }
.rs-x p { margin: var(--space-2) 0; } .rs-x-sym { font-size: var(--fs-lg); }
.rs-x-figs { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-3); font-size: var(--fs-xl); }
.rs-cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin: var(--space-5) 0; }
.an-index { position: sticky; top: 0; z-index: 3; display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-3); margin: var(--space-3) 0; padding: var(--space-2) var(--space-3); background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); font-size: var(--fs-sm); }
.an-index a { font-weight: 600; text-decoration: none; }
.an-group { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-3); margin: var(--space-6) 0 var(--space-2); padding-top: var(--space-3); border-top: 2px solid var(--gold); scroll-margin-top: 3.5rem; }
.an-group-t { font-family: var(--font-display); font-size: var(--fs-2xl); } .an-group-sub { font-size: var(--fs-sm); color: var(--muted); font-weight: 400; }
.an-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-3); }
.an-explain { margin: 0; padding: var(--space-3); border-radius: var(--radius); background: var(--surface-2); font-size: var(--fs-sm); }
.an-risk-table .acc-sub { display: block; font-weight: 400; text-transform: none; letter-spacing: 0; }
.ac-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-3); }
.ac-k { display: block; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.ac-big { font-size: var(--fs-2xl); font-weight: 650; letter-spacing: -.03em; }
.ac-spark { flex: 0 1 45%; min-width: 0; text-align: right; } .ac-spark-empty { font-size: var(--fs-xs); color: var(--muted); }
.chart-spark { display: block; width: 100%; height: 3rem; }
.c-spark { fill: none; stroke: var(--text-2); stroke-width: 2; vector-effect: non-scaling-stroke; }
.spark-gain .c-spark { stroke: var(--gain); } .spark-loss .c-spark { stroke: var(--loss); }
.ac-foot { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); margin: 0; color: var(--muted); }
.rd-chip-incomplete { color: var(--err); background: var(--err-bg); border-color: var(--err); }
.rd-chip-pending { color: var(--warn); background: var(--warn-bg); border-color: var(--warn); }
.ac-figures { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1199px) {
  .rs-hero-grid, .rs-perf-grid { grid-template-columns: minmax(0, 1fr); }
  .rs-kpis { padding-left: 0; border-left: 0; padding-top: var(--space-4); border-top: 1px solid var(--hero-line); }
}
@media (max-width: 759px) {
  .rs-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rs-value .xxl .fin { font-size: var(--fs-3xl); }
  .rs-extremes, .an-two { grid-template-columns: minmax(0, 1fr); }
  .rs-equity, .rs-perf, .rs-months, .an-cum, .an-capital, .an-risk, .an-dim { padding: var(--space-3); }
  .an-index { position: static; }
  .ac-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.rs-cut { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.c-cut { stroke: var(--err); stroke-width: 2; stroke-dasharray: 5 4; } .ct-cut { fill: var(--err); font-weight: 700; }

/* ── 21 · I8.1 · Conciliación iBroker (preview). Solo tokens. ── */
.ib-hero, .ib-sec { margin: var(--space-4) 0; } .ib-sec { padding: var(--space-4) var(--space-5); }
.ib-big { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.ib-big dt { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--hero-muted); }
.ib-big dd { margin: var(--space-1) 0 0; font-family: var(--font-financial); font-size: var(--fs-4xl); line-height: 1; color: var(--hero-text); }
.ib-reasons { margin: var(--space-3) 0 0; color: var(--hero-text); font-size: var(--fs-sm); }
.ib-strip-2 { margin-top: var(--space-2); }
.ib-checks { list-style: none; margin: var(--space-3) 0 0; padding: 0; display: grid; gap: var(--space-1); font-size: var(--fs-sm); }
.ib-ok > span:first-child { color: var(--ok); } .ib-ko > span:first-child { color: var(--err); }
.ib-fold { border-top: 1px solid var(--border); } .ib-unknown { margin: 0 0 var(--space-3); }
@media (max-width: 759px) { .ib-big { grid-template-columns: minmax(0, 1fr); } .ib-big dd { font-size: var(--fs-3xl); } .ib-sec { padding: var(--space-3); } }

/* ══════════════════════════════════════════════════════════════════════════
   B-07 · HOY (portada) y cola de etiquetado. Todo sale de los tokens de :root; los avisos usan modificadores propios (.is-warn/.is-ok): .warn/.info YA existen
   arriba como cajas con relleno y no deben reutilizarse aquí. Maqueta aprobada: docs/audits/B-06-hoy/.
   ══════════════════════════════════════════════════════════════════════════ */
.hoy { display: flex; flex-direction: column; gap: var(--space-4); max-width: 1180px; margin: 0 auto; }
.hoy-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-3); }
.hoy-id { min-width: 0; }
.hoy-title { font-family: var(--font-display); font-size: var(--fs-2xl); line-height: 1.1; margin: 0; }
.hoy-date { color: var(--muted); font-size: var(--fs-sm); margin: .15rem 0 0; }
.hoy-acc { color: var(--text-2); font-size: var(--fs-sm); margin: .1rem 0 0; }
.hoy-fresh { font-size: var(--fs-xs); color: var(--muted); text-align: right; line-height: 1.35; white-space: nowrap; flex: none; margin: 0; }
.hoy-fresh strong { color: var(--text-2); }
.hoy-accounts { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.hoy-accounts a { padding: .4rem .8rem; border: 1px solid var(--border-strong); border-radius: var(--radius-pill); font-size: var(--fs-sm); color: var(--text-2); text-decoration: none; min-height: 2.25rem; display: inline-flex; align-items: center; gap: .35rem; }
.hoy-accounts a span { color: var(--muted); font-size: var(--fs-xs); }
.hoy-accounts a[aria-current="page"] { background: var(--accent-soft); color: var(--accent-strong); border-color: var(--accent); font-weight: 700; }
.hoy-cols, .hoy-col { display: contents; }

.hoy-hero { background: var(--hero-bg); color: var(--hero-text); border: 1px solid var(--hero-line); border-radius: var(--radius-lg); padding: var(--space-4); box-shadow: var(--shadow-2); position: relative; }
.hoy-hero::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 2px; background: linear-gradient(90deg, var(--gold), transparent 70%); border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.hoy-k { font-size: var(--fs-xs); letter-spacing: .12em; text-transform: uppercase; color: var(--hero-muted); margin: 0; }
.hoy-big { font-family: var(--font-financial); font-variant-numeric: tabular-nums; font-size: var(--fs-3xl); font-weight: 600; line-height: 1.05; margin: .2rem 0 .1rem; }
.hoy-big small { font-size: var(--fs-md); font-weight: 500; color: var(--hero-muted); margin-left: .25rem; }
.hoy-big.gain { color: var(--hero-gain); } .hoy-big.loss { color: var(--hero-loss); } .hoy-big.none { color: var(--hero-muted); }
.hoy-sub { font-size: var(--fs-sm); color: var(--hero-muted); margin: 0; }
.hoy-sub .w { color: var(--hero-gain); } .hoy-sub .l { color: var(--hero-loss); }
.hoy-chip { position: absolute; top: .9rem; right: .9rem; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; padding: .1rem .55rem; border-radius: var(--radius-pill); border: 1px solid var(--hero-line); color: var(--hero-muted); }
.hoy-trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); margin-top: var(--space-4); padding-top: var(--space-3); border-top: 1px solid var(--hero-line); }
.hoy-trio .v { font-family: var(--font-financial); font-variant-numeric: tabular-nums; font-size: var(--fs-md); font-weight: 600; margin: .1rem 0 0; }
.hoy-trio .v.gain { color: var(--hero-gain); } .hoy-trio .v.loss { color: var(--hero-loss); }
.hoy-trio .s { font-size: var(--fs-xs); color: var(--hero-muted); margin: 0; }

.hoy-actions { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: var(--space-2); }
.hoy-act { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .15rem; min-height: 3.6rem; padding: .55rem .4rem; border-radius: var(--radius); border: 1px solid var(--border-strong); background: var(--surface); color: var(--text); font-size: var(--fs-sm); font-weight: 600; text-align: center; text-decoration: none; }
.hoy-act:hover { background: var(--surface-hover); }
.hoy-act .ic { font-size: 1.15rem; line-height: 1; }
.hoy-act.primary { background: var(--btn-bg); color: var(--btn-fg); border-color: var(--btn-bg); }
.hoy-act.primary:hover { background: var(--btn-bg-hover); }
.hoy-act .n { font-size: var(--fs-xs); font-weight: 700; padding: 0 .4rem; border-radius: var(--radius-pill); background: var(--warn-bg); color: var(--warn); }
.hoy-act:focus-visible, .hoy-op:focus-visible, .hoy-td .go:focus-visible, .hoy-banner-go:focus-visible, .bnav a:focus-visible, .bnav button:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

.hoy-banner { display: flex; gap: var(--space-3); align-items: center; padding: .7rem var(--space-3); border-radius: var(--radius); font-size: var(--fs-sm); border: 1px solid; }
.hoy-banner strong { display: block; } .hoy-banner span { font-size: var(--fs-xs); }
.hoy-banner.is-warn { background: var(--warn-bg); color: var(--warn); border-color: var(--warn); }
.hoy-banner.is-info { background: var(--info-bg); color: var(--text-2); border-color: var(--border-strong); }
.hoy-banner-ic { width: 1.4rem; height: 1.4rem; flex: none; display: grid; place-items: center; border-radius: 50%; border: 1.5px solid currentColor; font-weight: 700; font-size: .8rem; line-height: 1; }
.hoy-banner-go { margin-left: auto; font-weight: 700; text-decoration: none; color: inherit; border: 1px solid currentColor; border-radius: var(--radius); padding: .4rem .7rem; white-space: nowrap; min-height: 2.25rem; display: inline-grid; place-items: center; }

.hoy-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: var(--space-4); }
.hoy-st { display: flex; align-items: center; justify-content: space-between; margin: 0 0 var(--space-3); }
.hoy-st h2 { margin: 0; font-size: var(--fs-xs); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.hoy-st h2::before { content: ""; display: inline-block; width: .9rem; height: 2px; background: var(--gold); margin-right: .5rem; vertical-align: middle; }
.hoy-st a { font-size: var(--fs-sm); color: var(--accent); text-decoration: none; font-weight: 600; }

.hoy-ops { list-style: none; margin: 0; padding: 0; }
.hoy-op { display: grid; grid-template-columns: 3.1rem 1fr auto; gap: var(--space-3); align-items: center; min-height: 3.4rem; padding: .35rem 0; border-top: 1px solid var(--border); text-decoration: none; color: inherit; }
.hoy-ops li:first-child .hoy-op, .tag-op { border-top: 0; }
.hoy-op .t { font-family: var(--font-data); font-size: var(--fs-sm); color: var(--muted); }
.hoy-op .m { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.hoy-op .m b { font-size: var(--fs-base); }
.hoy-op .m span { font-size: var(--fs-xs); color: var(--muted); }
.hoy-op .r { text-align: right; font-family: var(--font-financial); font-variant-numeric: tabular-nums; }
.hoy-op .r b { display: block; font-size: var(--fs-md); } .hoy-op .r span { font-size: var(--fs-xs); color: var(--muted); }
.hoy .gain { color: var(--gain); } .hoy .loss { color: var(--loss); }
.hoy-hero .gain { color: var(--hero-gain); } .hoy-hero .loss { color: var(--hero-loss); }
.hoy-empty { text-align: center; padding: var(--space-5) var(--space-3); color: var(--muted); font-size: var(--fs-sm); margin: 0; }
.hoy-empty strong { display: block; color: var(--text); font-size: var(--fs-base); margin-bottom: .2rem; }

.hoy-week { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-2); }
.hoy-day { border: 1px solid var(--border); border-radius: var(--radius); padding: .5rem .25rem; text-align: center; background: var(--surface-2); min-height: 4.6rem; display: flex; flex-direction: column; justify-content: space-between; }
.hoy-day .d { font-size: var(--fs-xs); color: var(--muted); font-weight: 700; letter-spacing: .08em; }
.hoy-day .v { font-family: var(--font-financial); font-variant-numeric: tabular-nums; font-size: var(--fs-sm); font-weight: 600; }
.hoy-day .b { height: .3rem; border-radius: var(--radius-pill); background: var(--border); margin: .25rem .3rem 0; }
.hoy-day.g .b { background: var(--gain); } .hoy-day.p .b { background: var(--loss); }
.hoy-day.now { border-color: var(--accent); }
.hoy-day.sel { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; background: var(--accent-soft); }
.hoy-day.fut { opacity: .55; border-style: dashed; }
.hoy-day.hol { border-style: dashed; background: transparent; }
.hoy-day.hol .v { font-size: var(--fs-xs); color: var(--muted); font-family: var(--font-ui); }
.hoy-weekfoot { display: flex; justify-content: space-between; gap: var(--space-3); margin: var(--space-3) 0 0; font-size: var(--fs-sm); color: var(--text-2); flex-wrap: wrap; }

.hoy-todo { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.hoy-td { display: grid; grid-template-columns: 1.6rem 1fr auto; gap: var(--space-3); align-items: center; min-height: 3.2rem; padding: .35rem 0; border-top: 1px solid var(--border); }
.hoy-td:first-child { border-top: 0; }
.hoy-td .ti { width: 1.6rem; height: 1.6rem; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: .85rem; font-weight: 700; font-style: normal; line-height: 1; }
.hoy-td .ti.is-ok { background: var(--ok-bg); color: var(--ok); } .hoy-td .ti.is-warn { background: var(--warn-bg); color: var(--warn); } .hoy-td .ti.is-err { background: var(--err-bg); color: var(--err); }
.hoy-td .x b { display: block; font-size: var(--fs-base); } .hoy-td .x span { font-size: var(--fs-xs); color: var(--muted); }
.hoy-td .go { font-size: var(--fs-sm); font-weight: 700; color: var(--accent); text-decoration: none; padding: .45rem .7rem; border: 1px solid var(--border-strong); border-radius: var(--radius); min-height: 2.25rem; display: inline-grid; place-items: center; }

.hoy-eq { display: grid; grid-template-columns: 1fr auto; gap: var(--space-3); align-items: end; }
.hoy-eq svg { width: 100%; height: 3.8rem; display: block; }
.hoy-eq .st { font-size: var(--fs-xs); color: var(--muted); line-height: 1.5; text-align: right; margin: 0; } .hoy-eq .st b { color: var(--text); font-family: var(--font-financial); font-variant-numeric: tabular-nums; }
.hoy-eq .st b.loss { color: var(--loss); }

/* B-08 · días tocables, navegación de semana y «volver a hoy» */
.hoy-day-link { display: flex; flex-direction: column; justify-content: space-between; flex: 1; margin: -.5rem -.25rem; padding: .5rem .25rem; color: inherit; text-decoration: none; border-radius: var(--radius); }
.hoy-day-link:hover { background: var(--surface-hover); }
.hoy-day-link:focus-visible, .hoy-weeknav a:focus-visible, .hoy-back:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.hoy-weeknav { display: flex; justify-content: space-between; gap: var(--space-3); margin: var(--space-3) 0 0; padding-top: var(--space-3); border-top: 1px solid var(--border); font-size: var(--fs-sm); }
.hoy-weeknav a { color: var(--accent); text-decoration: none; font-weight: 600; min-height: 2.25rem; display: inline-flex; align-items: center; padding: 0 .25rem; }
.hoy-weeknav-now { color: var(--muted); display: inline-flex; align-items: center; min-height: 2.25rem; padding: 0 .25rem; }
.hoy-back { color: var(--accent); font-weight: 700; text-decoration: none; }

/* cola de etiquetado */
.tag-set { border: 0; padding: 0; margin: 0 0 var(--space-4); min-width: 0; }
.tag-set legend { font-size: var(--fs-xs); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 700; padding: 0; margin-bottom: var(--space-2); }
.tag-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.tag-chip { position: relative; }
.tag-chip input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.tag-chip span { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .4rem .9rem; border: 1px solid var(--border-strong); border-radius: var(--radius-pill); background: var(--surface-2); font-size: var(--fs-base); }
.tag-chip input:checked + span { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-strong); font-weight: 700; }
.tag-chip input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 2px; }
.tag-new { display: flex; flex-direction: column; gap: .3rem; margin-bottom: var(--space-3); font-size: var(--fs-sm); color: var(--text-2); }
.tag-new em { color: var(--muted); font-style: normal; }
.tag-new input { min-height: 2.75rem; padding: .5rem .75rem; font-size: var(--fs-md); border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--surface-elevated); color: var(--text); }
.tag-buttons { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--space-2); }
.tag-buttons .button { min-height: 3rem; justify-content: center; }
.tag-back { text-align: center; margin: 0; }
.tag-op { padding-top: 0; }

/* barra inferior del móvil (≤ 759 px) */
.bnav { display: none; }
@media (max-width: 759px) {
  .bnav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: grid; grid-template-columns: repeat(5, 1fr); align-items: end; background: var(--nav-bg); border-top: 1px solid var(--nav-line); padding: .35rem .25rem calc(.5rem + env(safe-area-inset-bottom, 0px)); }
  .bnav a, .bnav button { display: flex; flex-direction: column; align-items: center; gap: .1rem; color: var(--nav-text); font-size: var(--fs-xs); text-decoration: none; padding: .35rem 0; min-height: 2.9rem; background: transparent; border: 0; font-family: inherit; cursor: pointer; }
  .bnav .bn-ic { font-size: 1.15rem; line-height: 1; }
  .bnav [aria-current="page"] { color: var(--nav-text-strong); } .bnav [aria-current="page"] .bn-ic { color: var(--gold); }
  .bnav .bn-fab { display: grid; place-items: center; width: 3.2rem; height: 3.2rem; border-radius: 50%; background: var(--gold); color: var(--on-gold); font-size: 1.7rem; font-weight: 300; margin: -1.1rem auto 0; box-shadow: var(--shadow-2); border: 3px solid var(--nav-bg); min-height: 0; padding: 0; }
  body.has-shell .page { padding-bottom: 5.5rem; }
}
@media (max-width: 389px) { .hoy-big { font-size: var(--fs-2xl); } .hoy-trio { gap: var(--space-2); } }

/* escritorio: dos columnas */
@media (min-width: 1000px) {
  .hoy-cols { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: var(--space-4) var(--space-5); align-items: start; }
  .hoy-col { display: flex; flex-direction: column; gap: var(--space-4); }
  .hoy-act { flex-direction: row; gap: .5rem; min-height: 3rem; }
}
/* D2 · segundo factor (TOTP): alta, códigos de recuperación, paso 2 del acceso y sesiones. Solo tokens. */
.mfa-error { margin: 0 0 var(--space-4); padding: .7rem var(--space-3); border-radius: var(--radius); border: 1px solid var(--err); background: var(--err-bg); color: var(--err); }
.mfa-qr-box { display: inline-block; max-width: 100%; margin: var(--space-3) 0; border: 1px solid var(--border-strong); border-radius: var(--radius); overflow: hidden; }
.mfa-qr { display: block; width: min(100%, 15rem); height: auto; }
.mfa-secret { margin: .25rem 0 0; }
.mfa-secret code { display: inline-block; max-width: 100%; padding: .5rem .75rem; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--surface-2); font-family: var(--font-data); font-size: var(--fs-md); letter-spacing: .08em; overflow-wrap: anywhere; }
.mfa-form { display: flex; flex-direction: column; gap: var(--space-3); max-width: 24rem; }
.mfa-form input[type=text] { min-height: 2.75rem; font-size: var(--fs-md); }
.mfa-code-list { list-style: none; margin: var(--space-3) 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: var(--space-2); }
.mfa-code-list code { display: block; padding: .6rem .75rem; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--surface-2); font-family: var(--font-data); font-size: var(--fs-md); text-align: center; letter-spacing: .06em; }
.mfa-cancel { margin-top: var(--space-3); }
.mfa-intro { margin: 0 0 var(--space-3); }
.me-sessions { list-style: none; margin: 0 0 var(--space-3); padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
/* D3 · instalar como aplicación (PWA). Solo tokens. */
.me-install { margin: 0 0 var(--space-3); padding-left: 1.1rem; font-size: var(--fs-sm); color: var(--text-2); }
.me-install li { margin: .25rem 0; }
.offline { max-width: 36rem; width: calc(100% - 2 * var(--space-4)); margin: 12vh auto 0; }
[hidden] { display: none !important; }  /* el atributo hidden siempre gana a los estilos de botón/enlace (p. ej. «Instalar la aplicación») */