:root{
  --ink:#211a33; --ink2:#504662; --muted:#756b85;
  --violet:#6d4aa7; --violet-d:#4c2f86; --indigo:#2a1f4d; --indigo-2:#221a40;
  --blue:#3b6cf6; --teal:#0ea5a5; --gold:#f4b400; --gold-d:#d99a00;
  --green:#16a36b; --red:#e2483d; --rose:#fde3e1;
  --bg:#ece8f2; --bg2:#e4deeb; --card:#faf8fc; --line:#e1dae8; --line2:#d4cbdf;
  --lav:#f1edf6; --lav2:#e6deef;
  --shadow:0 1px 2px rgba(38,25,65,.05),0 9px 26px rgba(63,43,96,.09);
  --shadow-lg:0 13px 42px rgba(48,31,82,.18);
  --r:16px; --r-sm:11px;
  --sans:Inter,Aptos,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --disp:'Aptos Display',Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);
  font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(900px 520px at 88% -8%,rgba(244,180,0,.12),transparent 60%),
                   radial-gradient(850px 620px at -6% 8%,rgba(109,74,167,.14),transparent 56%),
                   linear-gradient(145deg,rgba(255,255,255,.18),transparent 48%);
  background-attachment:fixed;}
h1,h2,h3,h4{font-family:var(--disp);letter-spacing:-.02em;line-height:1.1}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,select{font-family:inherit;font-size:14px}
::selection{background:var(--gold);color:var(--indigo)}

/* ---------- LAYOUT ---------- */
.app{display:grid;grid-template-columns:248px 1fr;min-height:100vh}
.side{background:linear-gradient(180deg,#2c2152,#1d1539);color:#e9e3fb;
  display:flex;flex-direction:column;padding:22px 16px;position:sticky;top:0;height:100vh;
  box-shadow:6px 0 30px rgba(20,12,45,.18);z-index:5}
.brand{display:flex;align-items:center;gap:11px;padding:4px 8px 20px;flex-shrink:0}
.brand .mark{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--gold),#ff8a3d);color:#241334;font-family:var(--disp);
  font-weight:800;font-size:19px;box-shadow:0 6px 16px rgba(244,180,0,.35)}
.brand b{font-family:var(--disp);font-weight:800;font-size:16px;letter-spacing:-.02em;color:#fff;display:block}
.brand span{font-size:11px;color:#b7abdf;letter-spacing:.04em}
.nav{display:flex;flex-direction:column;gap:3px;margin-top:6px;flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}
.nav::-webkit-scrollbar{width:6px}
.nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:3px}
.nav::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.32)}
.nav-group{display:flex;flex-direction:column;gap:3px}.nav-group h4{margin:10px 12px 3px;color:rgba(255,255,255,.5);font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.nav-group:first-child h4{margin-top:2px}
.nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:11px;color:#c8bff0;
  font-weight:600;font-size:13.5px;text-decoration:none;transition:.18s;position:relative}
.nav a .ic{width:22px;display:grid;place-items:center;color:inherit}
.nav a .ic svg{width:20px;height:20px;opacity:.92}
.nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.nav a.on{background:linear-gradient(90deg,rgba(244,180,0,.22),rgba(244,180,0,.05));color:#fff}
.nav a.on::before{content:"";position:absolute;left:-16px;top:8px;bottom:8px;width:4px;border-radius:0 4px 4px 0;background:var(--gold)}
.side .foot{margin-top:auto;display:flex;flex-direction:column;gap:7px;padding-top:16px;border-top:1px solid rgba(255,255,255,.09);flex-shrink:0}
.side .foot button{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:10px;color:#cfc6ef;
  font-size:12.5px;font-weight:600;text-align:left;transition:.16s;width:100%}
.side .foot button:hover{background:rgba(255,255,255,.08);color:#fff}

.main{min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;gap:16px;padding:18px 30px;position:sticky;top:0;z-index:4;
  background:rgba(244,242,251,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line2)}
.topbar .title h1{font-size:23px}
.topbar .title p{color:var(--muted);font-size:12.5px;margin-top:1px}
.spacer{flex:1}
.monthsel{display:flex;align-items:center;gap:9px;background:var(--card);border:1px solid var(--line2);
  padding:7px 9px 7px 14px;border-radius:12px;box-shadow:var(--shadow)}
.monthsel label{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.monthsel select{border:none;background:var(--lav);border-radius:8px;padding:7px 10px;font-weight:700;color:var(--violet-d);cursor:pointer}
.rates{display:flex;gap:8px}
.rate{background:var(--card);border:1px solid var(--line2);border-radius:12px;padding:6px 13px;box-shadow:var(--shadow);text-align:right}
.rate .k{font-size:9.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.rate .v{font-size:15px;font-weight:800}
.rate.bcv .k{color:var(--blue)} .rate.par .k{color:var(--violet)} .rate.eur .k{color:var(--teal)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:12px;font-weight:700;font-size:13.5px;
  transition:.16s;border:1px solid transparent;white-space:nowrap}
.btn-gold{background:linear-gradient(135deg,var(--gold),#ff9a2e);color:#23142f;box-shadow:0 6px 16px rgba(244,180,0,.32)}
.btn-gold:hover{transform:translateY(-1px);box-shadow:0 9px 22px rgba(244,180,0,.42)}
.btn-ghost{background:var(--card);border-color:var(--line2);color:var(--violet-d);box-shadow:var(--shadow)}
.btn-ghost:hover{border-color:var(--violet);color:var(--violet)}
.btn-sm{padding:7px 12px;font-size:12.5px;border-radius:10px}

.content{padding:26px 30px 60px;animation:fade .4s ease both}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- CARDS / GRID ---------- */
.grid{display:grid;gap:16px}
.kpis{grid-template-columns:repeat(4,1fr)}
@media(max-width:1150px){.kpis{grid-template-columns:repeat(2,1fr)}}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px 18px 16px;
  box-shadow:var(--shadow);position:relative;overflow:hidden;transition:.2s}
.kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.kpi .lab{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:7px}
.kpi .big{font-family:var(--disp);font-weight:800;font-size:30px;margin-top:9px;letter-spacing:-.03em}
.kpi .sub{font-size:11.5px;color:var(--muted);margin-top:3px}
.kpi::after{content:"";position:absolute;right:-30px;top:-30px;width:90px;height:90px;border-radius:50%;opacity:.12}
.kpi.k-bs::after{background:var(--violet)} .kpi.k-bs .big{color:var(--violet-d)}
.kpi.k-gold{background:linear-gradient(160deg,#fff,#fff7e0);border-color:#f6e6b0}
.kpi.k-gold::after{background:var(--gold);opacity:.18} .kpi.k-gold .big{color:var(--gold-d)}
.kpi.k-blue::after{background:var(--blue)} .kpi.k-blue .big{color:var(--blue)}
.kpi.k-teal::after{background:var(--teal)} .kpi.k-teal .big{color:var(--teal)}

.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.panel .ph{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px}
.panel .ph h3{font-size:14.5px;font-weight:800}
.panel .ph .tag{margin-left:auto;font-size:11px;font-weight:700;color:var(--muted)}
.panel .pb{padding:16px 18px}
.dot{width:10px;height:10px;border-radius:3px;display:inline-block}

.cols-3{grid-template-columns:1.05fr 1fr 1fr}
.cols-2{grid-template-columns:1fr 1fr}
.cols-2u{grid-template-columns:1.15fr .85fr}
@media(max-width:1150px){.cols-3,.cols-2,.cols-2u{grid-template-columns:1fr}}

/* rows in panels */
.line{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px dashed var(--line2)}
.line:last-child{border-bottom:none}
.line .l{color:var(--ink2);font-weight:600;font-size:13px}
.line .v{font-weight:800;font-variant-numeric:tabular-nums}
.line.big .v{font-size:17px}
.q2{display:flex;gap:14px;font-size:11px;color:var(--muted);font-weight:700}
.q2 b{color:var(--ink2)}

.hero-line{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-radius:12px;margin-top:4px}
.hero-line.bs{background:linear-gradient(120deg,#2a1f4d,#42307e);color:#fff}
.hero-line.gold{background:linear-gradient(120deg,#fff3cf,#ffe39a);color:#5a3d00;border:1px solid #f1d684}
.hero-line .l{font-weight:800;font-size:13px;letter-spacing:.01em}
.hero-line .v{font-family:var(--disp);font-weight:800;font-size:21px}

/* envelope bars */
.env{margin:14px 0}
.env .top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.env .name{font-weight:800;font-size:13.5px}
.env .name small{font-weight:700;color:var(--muted);margin-left:6px}
.env .amt{font-size:12px;font-weight:700;color:var(--ink2)}
.env .track{height:13px;border-radius:8px;background:var(--lav2);overflow:hidden;position:relative}
.env .fill{height:100%;border-radius:8px;transition:width .9s cubic-bezier(.2,.8,.2,1)}
.env .meta{display:flex;justify-content:space-between;margin-top:5px;font-size:11.5px;font-weight:700}
.pill{font-size:11px;font-weight:800;padding:2px 9px;border-radius:20px}
.pill.ok{background:#e2f6ec;color:var(--green)} .pill.bad{background:var(--rose);color:var(--red)}

.callout{padding:13px 15px;border-radius:12px;font-size:13px;font-weight:600;display:block;line-height:1.55}
.callout.flexrow{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.callout.warn{background:#fff6e0;color:#7a5600;border:1px solid #f3dd9b}
.callout.good{background:#e4f7ee;color:#0f6b46;border:1px solid #bce8d2}
.callout.info{background:#eaf0fe;color:#274690;border:1px solid #c9d8fb}

/* ---------- TABLE ---------- */
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);
  font-weight:800;padding:10px 12px;border-bottom:2px solid var(--line2);white-space:nowrap}
.tbl td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.tbl tbody tr{transition:.12s}
.tbl tbody tr:hover{background:var(--lav)}
.tbl td.r,.tbl th.r{text-align:right;font-variant-numeric:tabular-nums}
.tbl .badge{font-size:11px;font-weight:800;padding:3px 9px;border-radius:7px;white-space:nowrap}
.b-in{background:#e3f6ec;color:var(--green)} .b-out{background:var(--rose);color:var(--red)}
.b-no{background:var(--lav2);color:var(--muted)}
.b-tipo{background:var(--lav2);color:var(--violet-d)}
.chip{font-size:11px;font-weight:700;color:var(--violet-d);background:var(--lav);padding:3px 8px;border-radius:6px}
.rowact{display:flex;gap:6px;opacity:0;transition:.15s}
.tbl tbody tr:hover .rowact{opacity:1}
.iconbtn{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;border:1px solid var(--line2);background:var(--card);font-size:13px;color:var(--ink2)}
.iconbtn:hover{border-color:var(--violet);color:var(--violet)}
.iconbtn.del:hover{border-color:var(--red);color:var(--red)}

/* editable inputs in tables */
.cinput{width:100%;border:1px solid transparent;background:transparent;border-radius:7px;padding:6px 8px;font-weight:600;color:var(--ink)}
.cinput:hover{background:var(--lav)} .cinput:focus{outline:none;background:var(--card);border-color:var(--violet);box-shadow:0 0 0 3px rgba(109,74,167,.12)}
.cinput.r{text-align:right;font-variant-numeric:tabular-nums}
select.cinput{cursor:pointer}
/* contenedor de tabla con scroll: alto máximo + encabezado fijo → la barra horizontal queda siempre a la vista */
.tscroll{overflow:auto;max-height:68vh}
.tscroll thead th{position:sticky;top:0;background:var(--card);z-index:2}

/* ---------- MODAL / FORM ---------- */
.ov{position:fixed;inset:0;background:rgba(30,20,55,.34);backdrop-filter:blur(2px);display:none;
  align-items:center;justify-content:center;z-index:40;padding:20px;animation:fade .2s both}
.ov.on{display:flex}
.modal{background:var(--card);border-radius:20px;width:min(680px,100%);max-height:92vh;overflow:auto;box-shadow:var(--shadow-lg);
  animation:pop .26s cubic-bezier(.2,.9,.3,1.2) both}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
.modal .mh{padding:20px 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;position:sticky;top:0;background:var(--card)}
.modal .mh h2{font-size:19px}.modal .mh .x{margin-left:auto;width:34px;height:34px;border-radius:10px;background:var(--lav);display:grid;place-items:center;font-size:17px;color:var(--ink2)}
.modal .mh .x:hover{background:var(--rose);color:var(--red)}
.form{padding:22px 24px;display:grid;grid-template-columns:1fr 1fr;gap:15px}
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.fld.full{grid-column:1/-1}
.fld input,.fld select{min-width:0;max-width:100%}
#pc_hint{display:block;line-height:1.55}
.modal{max-width:calc(100vw - 24px)}
.fld label{font-size:11.5px;font-weight:800;color:var(--ink2);letter-spacing:.02em}
.fld input,.fld select{padding:11px 13px;border:1.5px solid var(--line2);border-radius:11px;background:var(--bg);font-weight:600;transition:.15s}
.fld input:focus,.fld select:focus{outline:none;border-color:var(--violet);background:var(--card);box-shadow:0 0 0 3px rgba(109,74,167,.13)}
.fpreview{grid-column:1/-1;background:var(--lav);border-radius:12px;padding:13px 15px;display:flex;gap:22px;flex-wrap:wrap;font-size:12.5px}
.fpreview div b{display:block;font-family:var(--disp);font-size:17px;color:var(--violet-d);font-weight:800}
.fpreview div span{color:var(--muted);font-weight:700;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em}
.mf{padding:16px 24px 22px;display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.btn-solid{background:var(--violet);color:#fff}.btn-solid:hover{background:var(--violet-d)}

/* charts */
.chart-wrap{width:100%}
svg .seg{transition:opacity .2s} svg text{font-family:var(--sans)}
.legend{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:8px;font-size:12px;font-weight:700}
.legend span{display:flex;align-items:center;gap:6px;color:var(--ink2)}
.donut-center{font-family:var(--disp);font-weight:800}

.empty{padding:40px 20px;text-align:center;color:var(--muted)}
.empty h3{margin-top:8px;color:var(--ink2);font-size:15px}
.empty p{font-size:13px;margin-top:4px}
.empty .e{font-size:38px;margin-bottom:6px;opacity:.5}
.guide h3{margin:18px 0 8px;color:var(--violet-d);font-size:16px}
.guide p,.guide li{color:var(--ink2);font-size:13.5px;margin:5px 0;line-height:1.6}
.guide ul{padding-left:20px}
.guide .box{background:var(--lav);border-radius:12px;padding:14px 18px;margin:10px 0;border-left:3px solid var(--violet)}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--indigo);color:#fff;
  padding:12px 22px;border-radius:30px;font-weight:700;font-size:13px;box-shadow:var(--shadow-lg);opacity:0;transition:.3s;z-index:60;pointer-events:none}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.addmini{font-size:12.5px;font-weight:700;color:var(--violet);display:inline-flex;gap:6px;align-items:center;padding:8px 0}
.appmeta{font-size:10.5px;color:#958abf;text-align:center;padding:5px 8px 0;line-height:1.5}
.welcome-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.welcome-step{background:var(--lav);border:1px solid var(--line2);border-radius:12px;padding:13px;text-align:center}
.welcome-step span{font-size:25px;display:block;margin-bottom:6px}.welcome-step b{font-size:12.5px}.welcome-step p{font-size:11.5px;color:var(--muted);margin-top:4px}
@media(max-width:600px){.welcome-steps{grid-template-columns:1fr}.welcome-step{display:grid;grid-template-columns:36px 1fr;text-align:left}.welcome-step span{grid-row:1/3}.welcome-step p{margin-top:2px}}

/* chips de tasa en el formulario (v3.5) */
.tasa-chips{display:flex;gap:6px;margin-top:7px;flex-wrap:wrap}
.tchip{padding:6px 11px;border-radius:9px;border:1.5px solid var(--line2);background:var(--bg);font-weight:700;font-size:12px;color:var(--ink2);transition:.14s;min-height:34px}
.tchip:hover{border-color:var(--violet)}
.tchip.on{border-color:var(--violet);background:var(--lav);color:var(--violet-d);box-shadow:0 0 0 3px rgba(109,74,167,.12)}

/* ---------- DARK MODE ---------- */
[data-theme="dark"]{
  --ink:#ece8f7; --ink2:#c2b9da; --muted:#9089ad;
  --bg:#15111e; --bg2:#1b1630; --card:#201a31; --line:#2c2444; --line2:#3a3058;
  --lav:#241d39; --lav2:#2f2750;
  --shadow:0 1px 2px rgba(0,0,0,.32),0 10px 28px rgba(0,0,0,.38);
  --shadow-lg:0 16px 48px rgba(0,0,0,.55);
}
[data-theme="dark"] body{background-image:radial-gradient(900px 500px at 88% -8%,rgba(244,180,0,.07),transparent 60%),radial-gradient(800px 600px at -6% 8%,rgba(109,74,167,.16),transparent 55%)}
[data-theme="dark"] .topbar{background:rgba(21,17,30,.86)}
[data-theme="dark"] .kpi.k-gold{background:linear-gradient(160deg,#221a31,#2d2412);border-color:#4a3c1a}
[data-theme="dark"] .kpi.k-gold .big{color:#ffcf52}
[data-theme="dark"] .callout.warn{background:#2c2310;color:#f3d28a;border-color:#4d3d12}
[data-theme="dark"] .callout.good{background:#15281f;color:#86e0b2;border-color:#1f4733}
[data-theme="dark"] .callout.info{background:#161f33;color:#a9c2f5;border-color:#28396b}
[data-theme="dark"] .hero-line.gold{background:linear-gradient(120deg,#3a2e10,#4a3a12);color:#ffe39a;border-color:#5a481c}
[data-theme="dark"] .pill.ok,[data-theme="dark"] .badge.b-in{background:#15281f;color:#86e0b2}
[data-theme="dark"] .pill.bad,[data-theme="dark"] .badge.b-out{background:#311616;color:#f0a0a0}
[data-theme="dark"] .b-no,[data-theme="dark"] .b-tipo,[data-theme="dark"] .chip{background:#2f2750}
[data-theme="dark"] .fld input,[data-theme="dark"] .fld select,[data-theme="dark"] input[type=date]{color-scheme:dark}

/* modo claro cálido: menos blanco puro, más descanso y profundidad */
:root:not([data-theme="dark"]) .topbar{background:rgba(236,232,242,.86);border-bottom-color:#d8cfe2}
:root:not([data-theme="dark"]) .panel{background:linear-gradient(155deg,#fbf9fd 0%,#f7f3fa 100%);border-color:#dfd7e7}
:root:not([data-theme="dark"]) .panel .ph{background:rgba(234,227,241,.46);border-bottom-color:#ded5e6}
:root:not([data-theme="dark"]) .panel .pb{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(236,229,243,.13))}
:root:not([data-theme="dark"]) .kpi{background:linear-gradient(150deg,#fbf9fd,#f4eff8);border-color:#ddd5e5}
:root:not([data-theme="dark"]) .kpi.k-gold{background:linear-gradient(150deg,#fbf8ee,#f4ead0);border-color:#e8d9ad}
:root:not([data-theme="dark"]) .kpi.k-blue{background:linear-gradient(150deg,#f8f9fd,#edf1fa);border-color:#d8dfee}
:root:not([data-theme="dark"]) .kpi.k-teal{background:linear-gradient(150deg,#f7fbfa,#eaf5f2);border-color:#d2e5df}
:root:not([data-theme="dark"]) .modal{background:linear-gradient(160deg,#fbf9fd,#f4eff8)}
:root:not([data-theme="dark"]) .modal .mh{background:rgba(250,248,252,.94);border-bottom-color:#dcd3e5}
:root:not([data-theme="dark"]) .filters{background:#e9e2f0}
:root:not([data-theme="dark"]) .filters select,:root:not([data-theme="dark"]) .filters input{background:#f8f5fa;border-color:#d5cbdf}
:root:not([data-theme="dark"]) .monthsel,:root:not([data-theme="dark"]) .rate{background:#f8f5fa;border-color:#d8cfe2}
:root:not([data-theme="dark"]) .bottomnav{background:rgba(246,242,249,.84);border-color:rgba(255,255,255,.72)}
:root:not([data-theme="dark"]) .moresheet{background:#f7f3fa}
:root:not([data-theme="dark"]) .tbl tbody tr:hover{background:#ebe4f2}
:root:not([data-theme="dark"]) .cinput:focus{background:#fdfbfe}
:root:not([data-theme="dark"]) .welcome-step{background:#eee8f4}

/* tip del día (Tablero) */
.tip{display:flex;gap:15px;align-items:flex-start;background:linear-gradient(120deg,#2a1f4d,#46327f);
  color:#fff;border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.tip::after{content:"";position:absolute;right:-20px;bottom:-30px;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(244,180,0,.35),transparent 70%)}
.tip .ic{font-size:26px;flex-shrink:0;filter:drop-shadow(0 3px 6px rgba(0,0,0,.3))}
.tip .tx{position:relative;z-index:1}
.tip .tx h4{font-size:15px;margin-bottom:3px}
.tip .tx p{font-size:13px;color:#e6ddff;line-height:1.5}
.tip .tx .src{font-size:11px;color:var(--gold);font-weight:800;margin-top:6px;letter-spacing:.02em}
.tip .nx{position:relative;z-index:1;margin-left:auto;align-self:center;background:rgba(255,255,255,.14);color:#fff;border-radius:10px;padding:8px 12px;font-weight:800;font-size:16px}
.tip .nx:hover{background:rgba(255,255,255,.26)}

/* Aprende */
.learn-cat{margin-bottom:14px}
.learn-cat h3{font-size:16px;color:var(--violet);margin:22px 0 12px;display:flex;align-items:center;gap:9px}
.learn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.lesson{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 17px;box-shadow:var(--shadow);transition:.2s;border-left:4px solid var(--violet)}
.lesson:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.lesson h4{font-size:14.5px;margin-bottom:6px}
.lesson p{font-size:12.8px;color:var(--ink2);line-height:1.55}
.lesson .apply{font-size:12px;color:var(--ink2);background:var(--lav);border-radius:9px;padding:8px 11px;margin-top:9px;line-height:1.5}
.lesson .apply b{color:var(--violet)}
.lesson .src{font-size:11px;font-weight:800;color:var(--gold-d);margin-top:9px;display:block}
.intro-learn{background:linear-gradient(120deg,var(--violet),var(--violet-d));color:#fff;border-radius:var(--r);padding:20px 22px;margin-bottom:8px}
.intro-learn h2{font-size:21px;margin-bottom:5px}.intro-learn p{color:#e9e0ff;font-size:13px;max-width:680px}
/* biblioteca */
.booklib{display:grid;grid-template-columns:repeat(auto-fill,minmax(295px,1fr));gap:14px}
.bookcard{display:flex;background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:var(--shadow);cursor:pointer;transition:.2s}
.bookcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.bookcard .bspine{width:7px;background:var(--bc);flex-shrink:0}
.bookcard .bico{font-size:29px;padding:15px 4px 0 15px;flex-shrink:0}
.bookcard .binfo{padding:14px 16px 15px 11px}
.bookcard h4{font-size:14.5px;line-height:1.15;margin-bottom:3px}
.bookcard .bauth{font-size:11px;color:var(--muted);font-weight:700;margin-bottom:7px}
.bookcard .binfo p{font-size:12.3px;color:var(--ink2);line-height:1.45}
.bookcard .bread{display:inline-block;margin-top:10px;font-size:12px;font-weight:800;color:var(--bc)}
/* lector */
.reader{padding:22px 26px;max-width:760px}
.reader .rlead{font-size:15px;font-weight:700;color:var(--violet);line-height:1.5;margin-bottom:6px}
.reader h5{font-family:var(--disp);font-size:15px;color:var(--violet-d);margin:18px 0 7px}
[data-theme="dark"] .reader h5{color:#b79bef}[data-theme="dark"] .reader .rlead{color:#c4aef2}
.reader p{font-size:14px;color:var(--ink2);line-height:1.7}
.reader ul.rideas,.reader ol.rplan{padding-left:20px}
.reader ul.rideas li,.reader ol.rplan li{font-size:13.5px;color:var(--ink2);margin:7px 0;line-height:1.5}
.reader blockquote{border-left:3px solid var(--gold);background:var(--lav);padding:10px 15px;border-radius:0 10px 10px 0;margin:8px 0;font-style:italic;color:var(--ink);font-size:13.5px}
.reader .rve{background:linear-gradient(120deg,var(--lav),var(--lav2));border-radius:12px;padding:14px 16px;margin:16px 0}
.reader .rve b{color:var(--violet-d)}.reader .rve p{margin-top:4px;font-size:13.5px}
.reader .rbuy{font-size:11.5px;color:var(--muted);margin-top:16px;border-top:1px solid var(--line);padding-top:12px}

/* filtros Registro */
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--lav)}
.filters select,.filters input{padding:8px 11px;border:1.5px solid var(--line2);border-radius:9px;background:var(--card);font-weight:600;font-size:12.5px;color:var(--ink)}
.filters input{min-width:170px}
.filters .fl{font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.filters .order-label{margin-left:auto;padding-left:10px;border-left:1px solid var(--line2)}
.filters .clr{margin-left:auto;color:var(--violet);font-weight:700;font-size:12.5px}
@media(max-width:700px){.filters{padding:12px;gap:8px}.filters .filter-label,.filters .order-label{display:none}.filters input{flex:1 1 100%;min-width:0}.filters select{flex:1 1 calc(50% - 4px);min-width:0}.filters .sort-select{flex-basis:100%;order:5}.filters .clr{order:6;margin-left:0;width:100%;text-align:center;padding-top:3px}}

/* theme toggle */
#themebtn .sw{margin-left:auto;font-size:11px;opacity:.7}

/* ---------- ESTRATEGIAS DE REPARTO ---------- */
.strat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:700px){.strat-grid{grid-template-columns:1fr}}
.strat-card{border:2px solid var(--line2);border-radius:14px;padding:14px 15px;cursor:pointer;transition:.15s;background:var(--card)}
.strat-card:hover{border-color:var(--violet);transform:translateY(-2px);box-shadow:var(--shadow)}
.strat-card.on{border-color:var(--gold);background:linear-gradient(160deg,var(--card),rgba(244,180,0,.07))}
.sc-top{display:flex;align-items:center;gap:9px;margin-bottom:6px}
.sc-ic{font-size:20px}
.sc-top h4{font-size:14.5px}
.sc-cur{margin-left:auto;font-size:10.5px;font-weight:800;color:var(--gold-d);background:rgba(244,180,0,.16);padding:3px 9px;border-radius:12px;white-space:nowrap}
.strat-card>p{font-size:12.5px;color:var(--ink2);line-height:1.5}
.sbar{display:flex;height:12px;border-radius:7px;overflow:hidden;margin:10px 0 7px;gap:2px}
.sbar i{display:block;border-radius:3px;min-width:3px}
.sc-pcts{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:11px;font-weight:700;color:var(--ink2)}
.sc-pcts span{display:flex;align-items:center;gap:5px}
.sc-pcts .dot{width:8px;height:8px}
.sc-ideal{margin-top:9px;font-size:11.5px;color:var(--muted);background:var(--lav);border-radius:9px;padding:7px 10px;line-height:1.45}
.sc-custom{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px;cursor:default}
.sc-custom label{font-size:11.5px;font-weight:700;color:var(--ink2);display:flex;align-items:center;gap:6px;justify-content:space-between}
.sc-custom input{width:70px;padding:7px 8px;border:1.5px solid var(--line2);border-radius:8px;background:var(--bg);font-weight:700;text-align:right;color:var(--ink)}
.sc-custom input:focus{outline:none;border-color:var(--violet)}
.sc-sum{grid-column:1/-1;font-size:11.5px;font-weight:800;text-align:right}
.sc-sum.ok{color:var(--green)}.sc-sum.bad{color:var(--red)}

/* ---------- TARJETAS DE PRÉSTAMO ---------- */
.pcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px}
.pcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:16px 17px;display:flex;flex-direction:column;gap:10px;transition:.2s;border-top:4px solid var(--violet)}
.pcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.pcard.saldado{border-top-color:var(--green);opacity:.88}
.pcard .ptop{display:flex;align-items:flex-start;gap:6px 9px;flex-wrap:wrap} /* v4.3: badges largos ("N cuotas atrás") bajan de línea en vez de recortarse */
.pcard .ptop h4{font-size:15.5px;flex:1;line-height:1.2}
.pbadge{font-size:10.5px;font-weight:800;padding:3px 9px;border-radius:12px;white-space:nowrap}
.pbadge.mon{background:var(--lav2);color:var(--violet-d)}
.pbadge.tint{background:#fff3cf;color:#7a5600}
.pbadge.ok{background:#e2f6ec;color:var(--green)}
[data-theme="dark"] .pbadge.tint{background:#3a2e10;color:#f3d28a}
.pcard .ptotal{font-family:var(--disp);font-weight:800;font-size:26px;letter-spacing:-.02em}
.pcard .ptotal small{font-size:11px;color:var(--muted);font-weight:700;display:block;letter-spacing:.04em;text-transform:uppercase}
.pcard .pgrid{display:grid;grid-template-columns:1fr 1fr;gap:7px 14px;font-size:12px}
.pcard .pgrid div span{display:block;color:var(--muted);font-weight:700;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em}
.pcard .pgrid div b{font-variant-numeric:tabular-nums;font-size:13px}
.pcard .pnext{font-size:11.5px;color:var(--ink2);background:var(--lav);border-radius:9px;padding:7px 10px;font-weight:600}
.pcard .pacts{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:4px}
.pcard .pacts .btn{padding:7px 10px;font-size:12px;border-radius:9px}
/* estado de cuenta */
.edo{width:100%;border-collapse:collapse;font-size:12.5px}
.edo th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:800;padding:8px 9px;border-bottom:2px solid var(--line2);white-space:nowrap}
.edo td{padding:7px 9px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.edo td.r,.edo th.r{text-align:right}
.edo tr.eint td{color:var(--gold-d);font-weight:700}
.edo tr.eab td{color:var(--green)}
.edo tr.edes td{color:var(--ink2);font-weight:700}

/* ---------- SELECTOR DE TIPO (botones grandes) ---------- */
.seg-tipo{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.seg-tipo button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 6px;border:1.5px solid var(--line2);border-radius:11px;background:var(--bg);font-weight:700;font-size:12px;color:var(--ink2);transition:.13s;min-height:44px}
.seg-tipo button:hover{border-color:var(--violet)}
.seg-tipo button.on{border-color:var(--violet);background:var(--lav);color:var(--violet-d);box-shadow:0 0 0 3px rgba(109,74,167,.12)}
.seg-tipo .tic{font-size:17px}

/* ---------- MÓVIL ---------- */
@media(max-width:880px){
  .app{grid-template-columns:1fr}
  .side{position:sticky;top:0;height:auto;flex-direction:row;align-items:center;gap:10px;padding:10px 14px;overflow-x:auto;scrollbar-width:none}
  .side::-webkit-scrollbar{display:none}
  .brand{padding:0;flex-shrink:0}.brand span{display:none}
  .brand .mark{width:32px;height:32px;font-size:16px;border-radius:9px}
  .nav{flex-direction:row;margin:0;gap:2px;flex:0 0 auto;overflow:visible}.nav-group{display:contents}.nav-group h4{display:none}
  .nav a{padding:9px 10px;white-space:nowrap;font-size:12.5px}
  .nav a.on::before{display:none}
  .side .foot{margin:0;padding:0;border:none;flex-direction:row;flex-shrink:0}
  .side .foot button{white-space:nowrap;width:auto}
  .topbar{display:grid;grid-template-columns:1fr auto;grid-template-areas:"title add" "mes rates";gap:8px 10px;padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top));position:static;align-items:center}
  .topbar .title{grid-area:title;min-width:0}
  .topbar .btn-gold{grid-area:add;padding:9px 13px;font-size:12.5px}
  .topbar .spacer{display:none}
  .monthsel{grid-area:mes}
  .rates{grid-area:rates;justify-content:flex-end;overflow-x:auto;scrollbar-width:none}
  .rates::-webkit-scrollbar{display:none}
  .rate{padding:4px 9px;flex-shrink:0}
  .rate .v{font-size:13px}
  .rate .k{font-size:8.5px}
  .topbar .title h1{font-size:18px}
  .topbar .title p{display:none}
  .content{padding:16px 14px 50px}
  .kpi .big{font-size:24px}
  .form{grid-template-columns:1fr}
  .modal{border-radius:16px}
  .tip{flex-wrap:wrap}
  .seg-tipo{grid-template-columns:repeat(2,1fr)}
  .toast{bottom:auto;top:64px}
  .fab{display:grid}
  .fld input,.fld select{font-size:16px}
}
/* FAB móvil */
.fab{display:none;position:fixed;right:18px;bottom:18px;width:56px;height:56px;border-radius:50%;place-items:center;font-size:26px;font-weight:800;
  background:linear-gradient(135deg,var(--gold),#ff9a2e);color:#23142f;box-shadow:0 8px 24px rgba(244,180,0,.45);z-index:30;border:none}
/* en pantallas táctiles las acciones de fila siempre visibles */
@media(hover:none){.rowact{opacity:1}}
.kpi[title]{cursor:help}

/* microanimaciones: reveal escalonado */
.noanim *{animation:none!important} /* v4.5: re-render silencioso */
.content .grid{--d:0}
.grid>*{animation:rise .5s both}
.grid>*:nth-child(1){animation-delay:.02s}.grid>*:nth-child(2){animation-delay:.08s}
.grid>*:nth-child(3){animation-delay:.14s}.grid>*:nth-child(4){animation-delay:.2s}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.kpi .big{transition:none}

/* v3.6 UX-0: accesibilidad y fundaciones móvil */
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .grid>*{animation:none!important}
}
@supports(padding:max(0px)){
  .side{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));padding-top:max(22px,env(safe-area-inset-top))}
  .topbar{padding-top:max(18px,env(safe-area-inset-top))}
  .content{padding-bottom:max(60px,env(safe-area-inset-bottom))}
  .fab{right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom))}
  .toast{bottom:max(24px,env(safe-area-inset-bottom))}
}
.fab:active{transform:scale(.94)}
.tchip:active,.iconbtn:active{transform:scale(.92)}

/* v3.7: guía en accordion (tarjetas colapsables, escaneable) */
.gcards{display:flex;flex-direction:column;gap:10px;margin:14px 0}
.gcard{background:var(--card);border:1px solid var(--line);border-radius:13px;overflow:hidden;transition:.15s}
.gcard[open]{border-color:var(--gold);box-shadow:0 0 0 3px rgba(244,180,0,.08)}
.gcard summary{display:flex;align-items:center;gap:11px;padding:13px 15px;cursor:pointer;font-weight:800;font-size:14px;color:var(--ink);list-style:none}
.gcard summary::-webkit-details-marker{display:none}
.gcard summary::after{content:"▾";margin-left:auto;color:var(--muted);font-size:12px;transition:.2s}
.gcard[open] summary::after{transform:rotate(180deg)}
.gcard .gic{font-size:18px;width:24px;text-align:center;flex-shrink:0}
.gcard .gres{font-size:12px;font-weight:600;color:var(--muted);margin-left:6px}
.gcard .gb{padding:0 15px 14px;font-size:13px;color:var(--ink2);line-height:1.55}
.gcard .gb ul{padding-left:18px;margin:6px 0}
.gcard .gb li{margin:3px 0}
@media(max-width:560px){.gcard .gres{display:none}.gcard summary{font-size:13px;padding:12px 13px}}

/* v3.6 UX-2: bottom nav + menú Más (solo móvil) */
.bottomnav{display:none}
.moresheet{display:none}
.ms-scrim{display:none}
@media(max-width:880px){
  .side{display:none} /* reemplazada por bottom nav */
  /* Dock flotante elevado: separado del borde, translúcido (glass), redondeado */
  .bottomnav{display:flex;position:fixed;left:12px;right:12px;
    bottom:calc(14px + env(safe-area-inset-bottom));z-index:35;
    background:rgba(255,255,255,.72);
    backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
    border:1px solid rgba(255,255,255,.6);border-radius:22px;
    box-shadow:0 10px 30px rgba(30,20,60,.16),0 2px 8px rgba(30,20,60,.08);
    padding:8px 6px;justify-content:space-around;
    animation:dockIn .28s cubic-bezier(.2,.85,.25,1) both}
  @keyframes dockIn{from{transform:translateY(14px);opacity:.4}to{transform:none;opacity:1}}
  .bottomnav button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 2px;background:none;
    color:var(--muted);font-weight:700;flex:1;min-width:54px;min-height:56px;border-radius:14px;
    transition:background .18s,color .18s}
  .bottomnav button.on{color:var(--violet-d)}
  .bottomnav .bi{display:grid;place-items:center}
  .bottomnav .bi svg{width:23px;height:23px}
  .bottomnav .bl{font-size:10px;letter-spacing:.01em}
  .fab{bottom:calc(90px + env(safe-area-inset-bottom))!important}
  .content{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  .moresheet.on{display:block;position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--card);
    border-radius:18px 18px 0 0;box-shadow:0 -10px 40px rgba(30,20,60,.18);
    padding:8px 16px calc(20px + env(safe-area-inset-bottom));max-height:82vh;overflow:auto;
    animation:slideUp .26s cubic-bezier(.2,.8,.2,1) both}
  @keyframes slideUp{from{transform:translateY(100%)}to{transform:none}}
  .ms-handle{width:42px;height:5px;border-radius:3px;background:var(--line2);margin:4px auto 10px}
  .moresheet h3{font-size:15px;margin-bottom:10px}
  .ms-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .ms-grid a,.ms-grid button{display:flex;align-items:center;gap:10px;padding:12px 13px;border:1px solid var(--line2);
    border-radius:12px;background:var(--card);color:var(--ink);font-weight:700;font-size:12.5px;text-decoration:none;text-align:left}
  .ms-grid a:active,.ms-grid button:active{background:var(--lav)}
  .ms-grid .bi svg{width:19px;height:19px;color:var(--violet)}
  .ms-close{display:block;margin:14px auto 0;background:var(--lav);border:none;border-radius:12px;padding:11px 22px;font-weight:800;color:var(--violet-d)}
  .ms-scrim.on{display:block;position:fixed;inset:0;background:rgba(30,20,55,.45);z-index:44;backdrop-filter:blur(2px)}
  .toast{top:calc(64px + env(safe-area-inset-top))!important;bottom:auto!important}
  /* gráficas plegables en móvil */
  .charts-fold{display:none}
  .charts-fold.on{display:grid;grid-template-columns:1fr}
  .charts-toggle{display:inline-flex!important}
}

/* ============================================================
   v4: capa de pulido visual (solo CSS, no toca lógica)
============================================================ */
:root{--r:18px;--r-sm:12px}
html{scroll-behavior:smooth}
.app{min-height:100dvh}

/* foco visible con teclado, sin anillos al hacer clic con mouse */
:focus{outline:none}
:focus-visible{outline:2.5px solid var(--violet);outline-offset:2px;border-radius:6px}
[data-theme="dark"] :focus-visible{outline-color:var(--gold)}

/* ---- Desktop: contenido centrado en monitores anchos ---- */
@media(min-width:881px){
  .topbar{padding:16px clamp(22px,3.5vw,44px)}
  .content{padding:28px clamp(22px,3.5vw,44px) 70px;max-width:1440px;margin:0 auto;width:100%}
  .app{grid-template-columns:256px 1fr}
  .topbar .title h1{font-size:clamp(21px,1.7vw,25px)}
}

/* ---- Sidebar ---- */
.side{background:linear-gradient(180deg,#2e2257 0%,#241b47 55%,#1b1336 100%)}
.nav a{transition:background .18s,color .18s,transform .18s}
.nav a:hover{transform:translateX(2px)}
.nav a.on{box-shadow:inset 0 0 0 1px rgba(244,180,0,.18)}
.side .foot button{border-radius:11px}

/* ---- Topbar ---- */
.topbar{backdrop-filter:blur(14px) saturate(1.4)}
/* v4.1: flechas de navegación de mes */
.monthsel .mnav{width:30px;height:30px;min-width:30px;border-radius:9px;background:var(--lav);color:var(--violet-d);
  font-size:18px;font-weight:800;display:grid;place-items:center;line-height:1;transition:background .15s,transform .12s}
.monthsel .mnav:hover{background:var(--lav2)}
.monthsel .mnav:active{transform:scale(.9)}
.rate{transition:transform .16s,box-shadow .16s}
.rate:hover{transform:translateY(-1px);box-shadow:var(--shadow-lg)}

/* ---- KPIs: acento superior + jerarquía tipográfica ---- */
.kpi{border-radius:var(--r);padding:18px 18px 15px}
.kpi::before{content:"";position:absolute;left:0;top:0;right:0;height:4px;border-radius:4px 4px 0 0;opacity:.85}
.kpi.k-bs::before{background:linear-gradient(90deg,var(--violet),#9a7ad1)}
.kpi.k-gold::before{background:linear-gradient(90deg,var(--gold),#ff9a2e)}
.kpi.k-blue::before{background:linear-gradient(90deg,var(--blue),#7ea2ff)}
.kpi.k-teal::before{background:linear-gradient(90deg,var(--teal),#4fd3cf)}
.kpi .big{font-size:clamp(24px,2.1vw,32px)}
.kpi:hover{transform:translateY(-3px) scale(1.005)}

/* ---- Paneles ---- */
.panel{border-radius:var(--r)}
.panel .ph{background:linear-gradient(180deg,rgba(109,74,167,.045),transparent);padding:15px 20px}
.panel .pb{padding:18px 20px}
.panel .ph h3{font-size:15px}

/* ---- Tablas: zebra sutil + scroll táctil ---- */
.tbl tbody tr:nth-child(even){background:rgba(109,74,167,.028)}
.tbl tbody tr:hover{background:var(--lav)}
[data-theme="dark"] .tbl tbody tr:nth-child(even){background:rgba(255,255,255,.018)}
.tscroll{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
.tscroll::-webkit-scrollbar{height:8px;width:8px}
.tscroll::-webkit-scrollbar-thumb{background:var(--line2);border-radius:4px}
.tscroll::-webkit-scrollbar-thumb:hover{background:var(--violet)}

/* ---- Botones ---- */
.btn{transition:transform .15s,box-shadow .15s,background .15s,border-color .15s}
.btn:active{transform:translateY(0) scale(.97)}
.btn-gold{background:linear-gradient(135deg,#ffc426,#ff8f2a);text-shadow:0 1px 0 rgba(255,255,255,.25)}
.iconbtn{transition:border-color .14s,color .14s,transform .14s}
.iconbtn:active{transform:scale(.9)}

/* ---- Barras de sobres: más presencia ---- */
.env .track{height:14px;border-radius:9px;box-shadow:inset 0 1px 2px rgba(30,20,60,.08)}
[data-theme="dark"] .env .track{box-shadow:inset 0 1px 3px rgba(0,0,0,.4)}
.env .fill{box-shadow:0 1px 3px rgba(30,20,60,.18)}

/* ---- Tip del día ---- */
.tip{background:linear-gradient(115deg,#2d2154 0%,#4a338a 70%,#5b3f9e 100%)}

/* ---- Mercado v7.7: planificar, comprar y cerrar el pago sin mezclar estados ---- */
.market-intro{margin-bottom:12px;padding:11px 14px;border:1px solid var(--line2);border-radius:12px;background:var(--lav);color:var(--ink2);font-size:12.5px;font-weight:800}
.market-intro span{color:var(--muted);font-weight:700}
.market-rate{margin-bottom:14px}.market-rate-current{display:flex;align-items:center;justify-content:space-between;gap:12px}.market-rate-current span,.market-rate-current small{display:block}.market-rate-current small{color:var(--muted);font-size:9.5px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}.market-rate-current b{color:var(--ink);font-size:14px}.market-rate-picker{position:relative}.market-rate-picker summary{list-style:none;cursor:pointer;padding:8px 11px;border:1px solid var(--line2);border-radius:9px;color:var(--violet-d);font-size:12px;font-weight:900}.market-rate-picker summary::-webkit-details-marker{display:none}.market-rate-options{display:flex;position:absolute;right:0;top:calc(100% + 7px);z-index:28;gap:7px;padding:9px;border:1px solid var(--line2);border-radius:12px;background:var(--card);box-shadow:var(--shadow-lg);white-space:nowrap}.market-rate-options .btn{flex:none}.market-rate-help{margin-top:7px;color:var(--muted);font-size:11.5px}
.market-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,32%);gap:16px;align-items:start}.market-summary{position:sticky;top:16px}.market-summary-label{color:var(--muted);font-size:11.5px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.market-total{margin-top:5px;color:var(--ink);font:800 clamp(25px,3vw,34px)/1.1 var(--disp)}.market-equiv{margin-top:3px;color:var(--violet-d);font-size:14px;font-weight:900}.market-full{display:grid;grid-template-columns:1fr auto;gap:3px 10px;margin-top:16px;padding-top:13px;border-top:1px solid var(--line)}.market-full span{color:var(--muted);font-size:12px;font-weight:800}.market-full b{color:var(--ink);font-size:13px}.market-full small{grid-column:2;color:var(--muted);text-align:right}.market-summary-note{margin-top:12px;color:var(--muted);font-size:10.5px;font-weight:700}.market-summary-actions{display:grid;gap:8px;margin-top:14px}.market-summary-actions .btn:disabled{opacity:.45;cursor:not-allowed}.market-mobilebar{display:none}
.market-list-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center;padding:12px 18px;border-top:1px solid var(--line)}.market-list-actions .muted{color:var(--muted)}
.market-group{display:flex;justify-content:space-between;align-items:center;padding:8px 18px;background:var(--lav);color:var(--green);font-size:10.5px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}.market-group.pending{background:var(--bg2);color:var(--muted)}
.cchk{width:22px;height:22px;accent-color:var(--violet);cursor:pointer;flex-shrink:0}
.mkt{display:flex;flex-direction:column}
.mkitem{display:flex;gap:10px;align-items:flex-start;padding:10px 18px;border-bottom:1px solid var(--line);transition:background .15s}
.mkitem:hover{background:var(--lav)}
.mkitem .cchk{margin-top:7px}
.mk-main{flex:1;min-width:0;display:grid;grid-template-columns:minmax(130px,1fr) auto;gap:10px;align-items:center}
.mk-name{font-weight:700;font-size:14px;width:100%;padding:6px 8px}
.mk-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.mk-unit{display:flex;align-items:center;gap:5px}.mk-unit select{width:74px}.mk-qty-label{color:var(--muted);font-size:10.5px;font-weight:800}
.mk-price{width:88px}
.mk-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0}
.mk-sub{font-weight:800;color:var(--violet-d);white-space:nowrap;padding-top:7px;font-size:14px}
.mkitem.okrow{background:color-mix(in srgb,var(--green) 7%,var(--card))}.mkitem.okrow .mk-name{text-decoration:none}
@media(max-width:720px){.market-layout{display:block}.market-summary{position:static;margin-top:14px}.market-intro span{display:block;margin-top:2px}.mkitem{position:relative;padding:11px 13px}.mk-main{display:flex;flex-direction:column}.mk-name{padding-right:126px}.mk-controls{gap:6px;flex-wrap:nowrap}.mk-qty-label{display:none}.mk-price{width:72px}.mk-unit select{width:69px;padding:8px 5px}.mk-right{position:absolute;top:10px;right:13px;flex-direction:row;align-items:center;gap:5px}.mk-right .iconbtn{width:36px;height:36px;min-width:36px}.market-mobilebar{display:flex;position:sticky;top:8px;z-index:25;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px;padding:9px 10px 9px 14px;border:1px solid var(--line2);border-radius:16px;background:color-mix(in srgb,var(--card) 92%,transparent);box-shadow:var(--shadow-lg);backdrop-filter:blur(16px)}.market-mobilebar span{display:flex;flex-direction:column}.market-mobilebar small{color:var(--muted);font-size:9.5px;font-weight:800;text-transform:uppercase}.market-mobilebar b{color:var(--ink);font-size:14px}.market-mobilebar .btn{min-height:42px}}
.qty{display:flex;align-items:center;gap:2px}
.qty button{width:28px;height:28px;min-width:28px;border-radius:8px;background:var(--lav);color:var(--violet-d);
  font-size:15px;font-weight:800;display:grid;place-items:center;line-height:1;transition:background .14s,transform .1s}
.qty button:hover{background:var(--lav2)}
.qty button:active{transform:scale(.88)}
.qty input{width:56px;text-align:center}
.cartprog{padding:12px 18px;border-bottom:1px solid var(--line)}
.cartprog .track{height:10px;border-radius:6px;background:var(--lav2);overflow:hidden}
.cartprog .fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--gold),#ff9a2e);transition:width .4s cubic-bezier(.2,.8,.2,1)}
.cartprog .cp-meta{display:flex;justify-content:space-between;gap:10px;margin-top:6px;font-size:12px;font-weight:700;color:var(--ink2);flex-wrap:wrap}
.market-review-list{border:1px solid var(--line);border-radius:12px;overflow:hidden}.market-review-list>div{display:flex;justify-content:space-between;gap:14px;padding:10px 12px;border-bottom:1px solid var(--line);color:var(--ink2);font-size:12px}.market-review-list>div:last-child{border-bottom:0}.market-review-list span,.market-review-list small{display:block}.market-review-list small{margin-top:2px;color:var(--muted)}.market-review-list strong{white-space:nowrap;color:var(--ink)}

/* ============================================================
   MÓVIL (≤880px)
============================================================ */
@media(max-width:880px){
  /* modal como hoja inferior (bottom sheet) */
  .ov{align-items:flex-end;padding:0}
  .ov .modal{width:100%;max-width:100%;border-radius:22px 22px 0 0;max-height:92dvh;
    animation:sheetUp .3s cubic-bezier(.2,.85,.25,1) both;padding-bottom:env(safe-area-inset-bottom)}
  @keyframes sheetUp{from{opacity:.6;transform:translateY(45%)}to{opacity:1;transform:none}}
  .ov .modal .mh{padding-top:24px}
  .ov .modal .mh::before{content:"";position:absolute;top:9px;left:50%;transform:translateX(-50%);
    width:42px;height:5px;border-radius:3px;background:var(--line2)}
  .mf{position:sticky;bottom:0;background:var(--card);border-top:1px solid var(--line);z-index:2}
  .mf .btn{flex:1;justify-content:center;padding:13px 16px;font-size:14px}

  /* topbar compacta */
  .topbar{gap:8px}
  .monthsel{padding:5px 6px;min-width:0;gap:5px}
  .monthsel label{display:none}
  .monthsel select{padding:6px 2px;font-size:12.5px;min-width:0;flex:1}
  .monthsel .mnav{width:24px;height:26px;min-width:24px;font-size:15px;border-radius:7px}
  /* con overflow, flex-end recorta el primer chip por la izquierda */
  .rates{justify-content:flex-start}
  .rates>.rate:first-child{margin-left:auto}

  /* dock flotante: indicador tipo píldora + sombra inferior */
  .bottomnav{box-shadow:0 12px 34px rgba(30,20,60,.18),0 2px 10px rgba(30,20,60,.10)}
  .bottomnav button{position:relative;transition:color .18s,background .18s}
  .bottomnav button:active{background:var(--lav)}
  .bottomnav button .bi{padding:4px 15px;border-radius:14px;transition:background .2s}
  .bottomnav button.on .bi{background:var(--lav2)}
  [data-theme="dark"] .bottomnav{box-shadow:0 12px 34px rgba(0,0,0,.5),0 2px 10px rgba(0,0,0,.4);
    background:rgba(32,26,49,.68);border-color:rgba(255,255,255,.08)}

  /* tablas anchas: scroll horizontal limpio en vez de aplastarse */
  .tscroll .tbl{min-width:660px}
  .tscroll{max-height:none;border-radius:0 0 var(--r) var(--r)}

  /* paneles y grid más ajustados */
  .grid{gap:12px}
  .panel .ph{padding:13px 15px}.panel .pb{padding:14px 15px}
  .content{padding-left:12px;padding-right:12px}
}

/* ---- Teléfonos pequeños (≤480px): KPIs compactos 2×2 ---- */
@media(max-width:480px){
  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .kpi{padding:13px 13px 12px}
  .kpi .lab{font-size:9.5px;letter-spacing:.04em}
  .kpi .big{font-size:19px;margin-top:6px}
  .kpi .sub{font-size:10px}
  .kpi::after{width:64px;height:64px;right:-24px;top:-24px}
  .topbar .btn-gold{padding:8px 11px;font-size:12px}
  .hero-line .v{font-size:18px}
  .tip{padding:14px 15px}.tip .ic{font-size:22px}
  .rate{padding:4px 8px}
}

/* movimiento reducido: ya cubierto por la capa ux-a11i (*{animation:none;transition:none}) */

/* v5.1 · Biyuyos: jerarquía, privacidad y acciones compactas */
.hide-values .big.num,.hide-values .amount.num,.hide-values .mini-stat .num,.hide-values .hero-line .num,.hide-values .line .v.num,.hide-values td.r.num,.hide-values .today-amt.num,.hide-values .ptotal.num,.hide-values .money-private{filter:blur(7px);user-select:none;transition:filter .18s}
.hide-values .big.num:hover,.hide-values .amount.num:hover,.hide-values .mini-stat .num:hover,.hide-values .hero-line .num:hover,.hide-values .line .v.num:hover,.hide-values td.r.num:hover,.hide-values .today-amt.num:hover,.hide-values .ptotal.num:hover{filter:blur(5px)}
.topbar.today-mode .monthsel{display:none}.btn:disabled{opacity:.48!important;cursor:not-allowed!important;filter:saturate(.5)}
.summary-main{display:grid;grid-template-columns:1.25fr .75fr;gap:16px;margin-bottom:16px}
.balance-card{background:linear-gradient(135deg,#2e2257,#4b358a);color:#fff;border-radius:22px;padding:22px;box-shadow:var(--shadow-lg);position:relative;overflow:hidden}
.balance-card::after{content:"B";position:absolute;right:-12px;bottom:-60px;font:800 190px/1 var(--disp);color:rgba(255,255,255,.055)}
.balance-card .eyebrow{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:#cfc4f3;font-weight:800}
.balance-card .amount{font:800 clamp(30px,4vw,46px)/1.05 var(--disp);margin:9px 0 5px;position:relative;z-index:1}
.balance-card .equiv{font-size:12.5px;color:#ddd5f6;font-weight:650}
.mini-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mini-stat{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:15px;box-shadow:var(--shadow)}
.mini-stat span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800}.mini-stat b{display:block;font:800 19px var(--disp);margin-top:7px}
.notice-stack{margin-bottom:16px}.notice-more{margin-top:8px;border:1px solid var(--line2);border-radius:12px;background:var(--card)}
.notice-more summary{cursor:pointer;padding:10px 13px;font-size:12px;font-weight:800;color:var(--violet)}.notice-more>div{padding:0 10px 10px}.notice-more .callout{margin-top:8px!important}
.analysis-fold{border:0}.analysis-fold>summary{list-style:none;display:flex;justify-content:center;margin:4px 0 16px}.analysis-fold>summary::-webkit-details-marker{display:none}.analysis-fold>summary .btn::after{content:" ↓"}.analysis-fold[open]>summary .btn::after{content:" ↑"}
.mov-advanced{display:none!important}.seg-tipo.show-all .mov-advanced{display:flex!important}.seg-tipo button small{font-size:9px;color:var(--muted);font-weight:600;line-height:1.2}.seg-tipo button.on small{color:inherit;opacity:.78}.mov-more{grid-column:1/-1;padding:8px!important;min-height:auto!important}
.save-card{position:fixed;right:22px;bottom:22px;width:min(360px,calc(100vw - 28px));background:var(--card);border:1px solid var(--line2);border-radius:17px;padding:15px 16px;box-shadow:var(--shadow-lg);z-index:70;animation:pop .25s both}.save-card h4{color:var(--green);margin-bottom:6px}.save-card .saved-row{display:flex;justify-content:space-between;gap:12px;color:var(--ink2);font-size:12.5px}.save-card .saved-row b{color:var(--ink)}.save-card .saved-actions{display:flex;gap:8px;margin-top:12px}
.action-menu{position:relative;margin-left:auto}.action-menu summary{list-style:none;width:36px;height:34px;border:1px solid var(--line2);border-radius:9px;display:grid;place-items:center;cursor:pointer;font-weight:900}.action-menu summary::-webkit-details-marker{display:none}.action-menu>div{position:absolute;right:0;bottom:42px;min-width:180px;background:var(--card);border:1px solid var(--line2);border-radius:12px;padding:6px;box-shadow:var(--shadow-lg);z-index:8}.action-menu button{display:block;width:100%;padding:9px 10px;border-radius:8px;text-align:left;color:var(--ink2);font-size:12px;font-weight:700}.action-menu button:hover{background:var(--lav)}
.progress-mini{margin:2px 0}.progress-mini .track{height:8px;background:var(--lav2);border-radius:5px;overflow:hidden}.progress-mini .fill{height:100%;background:linear-gradient(90deg,var(--violet),var(--gold));border-radius:5px}.progress-mini .txt{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted);font-weight:700;margin-top:5px}
.today-list{display:flex;flex-direction:column}.today-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.today-row:last-child{border:0}.today-ic{width:38px;height:38px;border-radius:11px;background:var(--lav);display:grid;place-items:center;font-size:18px}.today-info{flex:1}.today-info b{font-size:13px}.today-info small{display:block;color:var(--muted);margin-top:2px}.today-amt{font-weight:800}
@media(max-width:880px){
  .summary-main{grid-template-columns:1fr}.balance-card{padding:19px}.mini-summary{grid-template-columns:repeat(3,1fr)}
  .topbar{grid-template-columns:1fr auto;grid-template-areas:"title add" "mes mes" "rates rates"}
  .monthsel{justify-content:center}.rates{justify-content:center}.rate{box-shadow:none;background:transparent;border:0;padding:2px 8px}.rate .v{font-size:12px}.rate .k{font-size:8px}
  .topbar.today-mode{grid-template-areas:"title add" "rates rates"}.topbar.today-mode .rates{border-top:1px solid var(--line);padding-top:5px}
  .save-card{left:14px;right:14px;bottom:calc(94px + env(safe-area-inset-bottom));width:auto}
}
@media(max-width:520px){.mini-summary{grid-template-columns:1fr 1fr}.summary-main{gap:10px}.balance-card .amount{font-size:31px}.seg-tipo button{min-height:62px}}
@media(max-width:520px){.mf .btn{flex:1 1 135px;justify-content:center}.modal .mf{padding:13px 16px calc(18px + env(safe-area-inset-bottom))}}
/* Diálogos contextuales comunes */
.ui-dialog-overlay{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:18px;background:rgba(31,24,44,.58);backdrop-filter:blur(3px)}
.ui-dialog{width:min(520px,100%);max-height:min(720px,calc(100dvh - 36px));overflow:auto;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:22px;box-shadow:0 24px 70px rgba(25,18,40,.28);padding:22px;display:grid;grid-template-columns:auto 1fr;gap:14px}
.ui-dialog-icon{font-size:25px}.ui-dialog h2{font-size:19px;margin:2px 0 8px}.ui-dialog-body{color:var(--ink2);line-height:1.55;font-size:14px}.ui-dialog-label{display:block;font-weight:800;margin:16px 0 6px}.ui-dialog input{width:100%}.ui-dialog-error{color:var(--red);font-size:12px;font-weight:800;margin-top:6px;min-height:18px}.ui-dialog-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:9px;margin-top:8px}.btn-danger{background:var(--red);color:#fff;border-color:var(--red)}
@media(max-width:520px){.ui-dialog{grid-template-columns:1fr;padding:18px;border-radius:18px}.ui-dialog-icon{font-size:22px}.ui-dialog-actions{display:grid;grid-template-columns:1fr}.ui-dialog-actions .btn{min-height:46px}}
.account-impact{display:grid;gap:7px;margin-top:10px}.account-impact>div{display:flex;justify-content:space-between;gap:16px}.impact-out{color:var(--red)}.impact-in{color:var(--green)}
.fld:is(fieldset){border:0;padding:0;margin:0;min-width:0}.fld>legend{font-size:12px;font-weight:800;color:var(--ink2);margin-bottom:7px}