:root{
    --bg:#0d1524;
    --surface:#16203a;
    --surface-2:#1e2b48;
    --surface-3:#26324424;
    --border:#2d3d5e;
    --ink:#f2f5fb;
    --ink-dim:#9aabc7;
    --ink-faint:#6478a0;
    --teal:#00e5a0;
    --teal-dim:#0a3d33;
    --coral:#ff6b4a;
    --coral-dim:#4a2318;
    --gold:#ffc933;
    --gold-dim:#4a3a10;
    --violet:#a06bff;
    --violet-dim:#2e2150;
    --pink:#ff5db1;
    --blue:#3b9dff;
    --green:#7ed957;
    --radius:14px;
    --radius-sm:9px;
  }
  *{box-sizing:border-box;}

  /* ---------- iPhone: áreas seguras y gestos ----------
     Sin esto la barra de pestañas queda debajo del indicador de inicio
     y el encabezado debajo del notch cuando corre como app. */
  html{
    background:var(--bg);                 /* el rebote del scroll no muestra blanco */
    -webkit-text-size-adjust:100%;
  }
  body{
    overscroll-behavior-y:none;           /* sin rebote elástico de página */
    -webkit-tap-highlight-color:transparent;
  }
  button, .filtro-chip, nav.tabbar button{
    -webkit-touch-callout:none;
    -webkit-user-select:none; user-select:none;
  }
  /* el texto de los datos sí se puede seleccionar y copiar */
  input, textarea, .num, .stat-info, .debt-sub{ -webkit-user-select:text; user-select:text; }

  html,body{margin:0;padding:0;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'Inter',sans-serif;
    -webkit-font-smoothing:antialiased;
    min-height:100vh;
  }
  #app{
    max-width:480px;
    margin:0 auto;
    min-height:100vh;
    background:var(--bg);
    display:flex;
    flex-direction:column;
    position:relative;
    border-left:1px solid var(--border);
    border-right:1px solid var(--border);
  }
  .num{font-family:'JetBrains Mono',monospace; font-variant-numeric: tabular-nums;}
  .display{font-family:'Space Grotesk',sans-serif;}

  /* Header */
  header{
    padding:calc(20px + env(safe-area-inset-top)) 18px 14px;
    border-bottom:1px solid var(--border);
    position:sticky; top:0; z-index:10;
    background:linear-gradient(180deg, var(--bg) 80%, transparent);
    backdrop-filter:blur(6px);
  }
  .brand{
    display:flex; align-items:center; justify-content:space-between;
  }
  .brand h1{
    font-family:'Space Grotesk',sans-serif;
    font-size:19px; font-weight:700; margin:0;
    letter-spacing:-0.01em;
  }
  .brand h1 span{color:var(--teal);}
  .month-nav{
    display:flex; align-items:center; gap:10px; margin-top:14px;
  }
  .month-nav button{
    background:var(--surface); border:1px solid var(--border);
    color:var(--ink-dim); width:32px; height:32px; border-radius:9px;
    font-size:16px; cursor:pointer; display:flex; align-items:center; justify-content:center;
  }
  .month-nav button:hover{color:var(--teal); border-color:var(--teal);}
  .month-label{
    flex:1; text-align:center; font-family:'Space Grotesk',sans-serif;
    font-size:15px; font-weight:600; text-transform:capitalize;
  }

  main{flex:1; padding:16px 16px calc(100px + env(safe-area-inset-bottom));}
  section{display:none;}
  section.active{display:block; animation:fadeIn .25s ease;}
  @keyframes fadeIn{from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);}}

  /* Summary cards */
  .grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:16px;}
  .stat-card{
    background:var(--surface); border:1px solid var(--border);
    border-radius:var(--radius-sm); padding:12px 10px;
  }
  .stat-card .lbl{font-size:10.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-bottom:6px;}
  .stat-card .val{font-size:15px; font-weight:600;}
  .stat-card.ingreso .val{color:var(--teal);}
  .stat-card.gasto .val{color:var(--coral);}
  .stat-card.balance .val{color:var(--gold);}

  .section-title{
    font-family:'Space Grotesk',sans-serif; font-size:13px; font-weight:600;
    color:var(--ink-dim); text-transform:uppercase; letter-spacing:.06em;
    margin:22px 0 10px; display:flex; justify-content:space-between; align-items:center;
  }
  .section-title:first-child{margin-top:0;}

  .panel{
    background:var(--surface); border:1px solid var(--border);
    border-radius:var(--radius); padding:4px; margin-bottom:6px;
  }
  .row-item{
    display:flex; align-items:center; justify-content:space-between;
    padding:11px 12px;
  }
  .row-item + .row-item{border-top:1px solid var(--border);}
  .row-item .name{font-size:13.5px; font-weight:500;}
  .row-item .amt{font-size:13.5px; font-weight:600;}

  /* bar breakdown */
  .bar-item{padding:10px 12px;}
  .bar-item + .bar-item{border-top:1px solid var(--border);}
  .bar-top{display:flex; justify-content:space-between; font-size:12.5px; margin-bottom:6px;}
  .bar-top .cat{font-weight:500; display:flex; align-items:center; gap:7px;}
  .dot{width:8px; height:8px; border-radius:50%; flex-shrink:0;}
  .bar-track{height:5px; background:var(--surface-2); border-radius:4px; overflow:hidden;}
  .bar-fill{height:100%; border-radius:4px;}

  /* Movimientos list */
  .tx-list .row-item{align-items:flex-start;}
  .tx-left{display:flex; gap:10px; align-items:flex-start;}
  .tx-cat-dot{width:9px; height:9px; border-radius:3px; margin-top:4px; flex-shrink:0;}
  .tx-info .desc{font-size:13.5px; font-weight:500;}
  .tx-info .meta{font-size:11px; color:var(--ink-faint); margin-top:2px;}
  .tx-amt{font-size:14px; font-weight:600; text-align:right; white-space:nowrap;}
  .tx-amt.pos{color:var(--teal);}
  .tx-amt.neg{color:var(--coral);}
  .tx-del{background:none; border:none; color:var(--ink-faint); font-size:11px; cursor:pointer; padding:4px 0 0; text-align:right; width:100%;}
  .tx-del:hover{color:var(--coral);}
  .empty-state{
    text-align:center; padding:36px 20px; color:var(--ink-faint); font-size:13px;
  }

  /* Tarjetas */
  .card-tile{
    background:linear-gradient(135deg, var(--surface-2), var(--surface));
    border:1px solid var(--border); border-radius:var(--radius);
    padding:16px; margin-bottom:12px; position:relative; overflow:hidden;
  }
  .card-tile::before{
    content:''; position:absolute; top:-30px; right:-30px; width:100px; height:100px;
    border-radius:50%; background:var(--card-accent, var(--gold)); opacity:.10;
  }
  .card-tile .ct-head{display:flex; justify-content:space-between; align-items:flex-start;}
  .card-tile .ct-name{font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:15px;}
  .card-tile .ct-badge{
    font-size:10px; padding:3px 8px; border-radius:20px; font-weight:600;
    background:var(--card-accent, var(--gold)); color:#141a22;
  }
  .card-tile .ct-amount{font-size:24px; font-weight:700; margin:14px 0 2px; color:var(--card-accent, var(--gold));}
  .card-tile .ct-sub{font-size:11px; color:var(--ink-faint); margin-bottom:14px;}
  .ct-dates{display:flex; gap:10px;}
  .ct-date-box{flex:1; background:rgba(255,255,255,.03); border-radius:9px; padding:8px 10px;}
  .ct-date-box .l{font-size:9.5px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em;}
  .ct-date-box .d{font-size:12.5px; font-weight:600; margin-top:2px;}
  .ct-limit{margin-top:12px;}
  .ct-limit-top{display:flex; justify-content:space-between; font-size:11px; color:var(--ink-dim); margin-bottom:6px;}
  .ct-limit-top .num{color:var(--ink); font-weight:600;}
  .ct-usd-line{font-size:11px; color:var(--ink-faint); margin-top:8px;}
  .warn-banner{
    display:flex; gap:9px; align-items:flex-start;
    background:var(--coral-dim); border:1px solid var(--coral); border-radius:var(--radius-sm);
    padding:11px 12px; margin-bottom:12px; font-size:12.5px; color:var(--ink);
  }
  .warn-banner b{color:var(--coral);}

  /* Chat asistente */
  .chat-box{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
    padding:12px; min-height:140px; max-height:52vh; overflow-y:auto; margin-top:14px;
  }
  .chat-msg{margin-bottom:10px; max-width:88%; padding:9px 12px; border-radius:13px; font-size:13px; line-height:1.45; white-space:pre-wrap;}
  .chat-msg.user{background:var(--teal-dim); color:var(--ink); margin-left:auto; border-bottom-right-radius:3px;}
  .chat-msg.assistant{background:var(--surface-2); margin-right:auto; border-bottom-left-radius:3px;}
  .chat-msg.loading{color:var(--ink-faint); font-style:italic;}
  .chat-input-row{display:flex; gap:8px; margin-top:10px;}
  .chat-input-row input{
    flex:1; background:var(--surface-2); border:1px solid var(--border); color:var(--ink);
    padding:11px 12px; border-radius:9px; font-size:16px; font-family:'Inter',sans-serif;
  }
  .chat-input-row input:focus{outline:none; border-color:var(--teal);}
  .chat-send{
    flex:0 0 auto; background:var(--teal); color:#0f1620; border:none;
    width:42px; border-radius:9px; font-size:16px; cursor:pointer; font-weight:700;
  }
  .chat-send:disabled{opacity:.5; cursor:default;}

  /* Presupuesto por categoría */
  .budget-line{display:flex; justify-content:space-between; font-size:10.5px; color:var(--ink-faint); margin-top:4px;}
  .budget-line .num{color:var(--ink-dim); font-weight:600;}

  /* Tendencia entre meses */
  .trend-chart{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
    padding:16px 10px 10px; display:flex; align-items:flex-end; gap:6px; height:170px; margin-bottom:6px;
  }
  .trend-col{flex:1; display:flex; flex-direction:column; align-items:center; height:100%; justify-content:flex-end;}
  .trend-bars{display:flex; align-items:flex-end; gap:3px; height:120px; width:100%; justify-content:center;}
  .trend-bar{width:9px; border-radius:3px 3px 0 0; min-height:2px;}
  .trend-bar.ing{background:var(--teal);}
  .trend-bar.gas{background:var(--coral);}
  .trend-label{font-size:9.5px; color:var(--ink-faint); margin-top:6px; text-transform:capitalize;}
  .trend-legend{display:flex; gap:16px; justify-content:center; font-size:11px; color:var(--ink-dim); margin-bottom:14px;}
  .trend-legend span{display:flex; align-items:center; gap:5px;}
  .trend-legend .sw{width:9px; height:9px; border-radius:3px;}

  /* Metas de ahorro */
  .meta-tile{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:14px; margin-bottom:10px;}
  .ct-actions{display:flex; gap:8px; margin-top:12px;}
  .ct-actions button{
    flex:1; background:none; border:1px solid var(--border); color:var(--ink-dim);
    padding:7px; border-radius:8px; font-size:11.5px; cursor:pointer;
  }
  .ct-actions button:hover{border-color:var(--card-accent,var(--gold)); color:var(--ink);}

  /* Cuentas config list */
  .acc-row{display:flex; align-items:center; gap:10px; padding:11px 12px;}
  .acc-row + .acc-row{border-top:1px solid var(--border);}
  .acc-swatch{width:10px; height:10px; border-radius:3px; flex-shrink:0;}
  .acc-name{flex:1; font-size:13.5px; font-weight:500;}
  .acc-type{font-size:10.5px; color:var(--ink-faint); text-transform:uppercase;}
  .acc-edit,.acc-del{background:none; border:none; color:var(--ink-faint); cursor:pointer; font-size:14px; padding:4px;}
  .acc-del:hover{color:var(--coral);} .acc-edit:hover{color:var(--teal);}

  .btn-add-inline{
    width:100%; background:none; border:1px dashed var(--border); color:var(--ink-dim);
    padding:11px; border-radius:var(--radius-sm); font-size:13px; cursor:pointer; margin-top:8px;
    font-weight:500;
  }
  .btn-add-inline:hover{border-color:var(--teal); color:var(--teal);}

  /* FAB */
  .fab{
    position:fixed; bottom:84px; left:50%; transform:translateX(calc(-50% + 190px));
    width:54px; height:54px; border-radius:50%;
    background:var(--teal); color:#0f1620; border:none;
    font-size:26px; font-weight:600; cursor:pointer;
    box-shadow:0 6px 20px rgba(79,209,197,.35);
    display:flex; align-items:center; justify-content:center; z-index:20;
  }
  @media (max-width:480px){
    .fab{ right:16px; left:auto; transform:none; }
  }

  /* Bottom nav */
  nav.tabbar{
    position:sticky; bottom:0; z-index:15;
    padding-bottom:env(safe-area-inset-bottom);
    background:rgba(15,22,32,.92); backdrop-filter:blur(10px);
    border-top:1px solid var(--border);
    display:flex; max-width:480px; margin:0 auto; width:100%;
  }
  /* Estado de cuenta / estadísticas */
  .estado-total{
    background:linear-gradient(135deg, var(--surface-2), var(--surface));
    border:1px solid var(--border); border-radius:var(--radius); padding:16px; margin-bottom:14px;
  }
  .estado-total .et-label{font-size:11px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em;}
  .estado-total .et-amount{font-size:28px; font-weight:700; color:var(--coral); margin-top:4px;}
  .estado-total .et-sub{font-size:11.5px; color:var(--ink-dim); margin-top:4px;}
  .stat-row{display:flex; align-items:center; gap:10px; padding:10px 0;}
  .stat-row + .stat-row{border-top:1px solid var(--border);}
  .stat-rank{width:22px; height:22px; border-radius:50%; background:var(--surface-2); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; color:var(--ink-dim); flex-shrink:0;}
  .stat-info{flex:1;}
  .stat-info .sn{font-size:13px; font-weight:500;}
  .stat-info .ss{font-size:11px; color:var(--ink-faint); margin-top:2px;}
  .stat-val{font-size:13px; font-weight:600; text-align:right;}
  .filtro-chip{
    background:var(--surface-2); border:1px solid var(--border); color:var(--ink-dim);
    padding:7px 13px; border-radius:20px; font-size:12px; cursor:pointer;
    font-family:'Inter',sans-serif; font-weight:500; transition:all .15s;
  }
  .filtro-chip.on{ background:var(--teal); border-color:var(--teal); color:#08221c; font-weight:600; }

  nav.tabbar button{
    flex:1; background:none; border:none; color:var(--ink-faint);
    padding:11px 2px 9px; font-size:9.5px; cursor:pointer;
    display:flex; flex-direction:column; align-items:center; gap:4px;
    font-family:'Inter',sans-serif; font-weight:500;
  }
  nav.tabbar button .ic{font-size:18px;}
  nav.tabbar button.active{color:var(--teal);}

  /* Deudas */
  .debt-tile{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
    padding:14px; margin-bottom:10px;
  }
  .debt-top{display:flex; justify-content:space-between; align-items:flex-start; gap:10px;}
  .debt-name{font-size:13.5px; font-weight:600;}
  .debt-sub{font-size:11px; color:var(--ink-faint); margin-top:2px;}
  .debt-badge{font-size:10px; padding:3px 8px; border-radius:20px; font-weight:600; white-space:nowrap;}
  .debt-badge.on{background:var(--violet); color:#141a22;}
  .debt-badge.done{background:var(--surface-2); color:var(--ink-faint);}
  .debt-nums{display:flex; justify-content:space-between; margin-top:12px; font-size:11.5px; color:var(--ink-dim);}
  .debt-nums .num{color:var(--ink); font-weight:600;}
  .debt-progress{margin-top:8px;}
  .debt-del{background:none; border:none; color:var(--ink-faint); font-size:11px; cursor:pointer; margin-top:10px; padding:0;}
  .debt-del:hover{color:var(--coral);}

  /* Modal */
  .modal-overlay{
    position:fixed; inset:0; background:rgba(6,10,16,.72);
    display:none; align-items:flex-end; justify-content:center; z-index:50;
  }
  .modal-overlay.open{display:flex;}
  .modal{
    background:var(--surface); width:100%; max-width:480px;
    border-radius:20px 20px 0 0; padding:20px 18px 26px;
    max-height:88vh; overflow-y:auto;
    animation:slideUp .25s ease;
    border-top:1px solid var(--border);
  }
  @keyframes slideUp{from{transform:translateY(30px); opacity:0;} to{transform:translateY(0); opacity:1;}}
  .modal-handle{width:36px; height:4px; background:var(--border); border-radius:4px; margin:0 auto 16px;}
  .modal h2{font-family:'Space Grotesk',sans-serif; font-size:17px; margin:0 0 16px;}
  .field{margin-bottom:13px;}
  .field label{display:block; font-size:11.5px; color:var(--ink-dim); margin-bottom:6px; font-weight:500;}
  .field input, .field select{
    width:100%; background:var(--surface-2); border:1px solid var(--border);
    color:var(--ink); padding:11px 12px; border-radius:9px; font-size:16px;
    font-family:'Inter',sans-serif;
  }
  .field input:focus, .field select:focus{outline:none; border-color:var(--teal);}
  .toggle-row{display:flex; gap:8px; margin-bottom:13px;}
  .toggle-row button{
    flex:1; padding:10px; border-radius:9px; border:1px solid var(--border);
    background:var(--surface-2); color:var(--ink-dim); font-size:13px; font-weight:600; cursor:pointer;
  }
  .toggle-row button.on.ingreso{background:var(--teal-dim); border-color:var(--teal); color:var(--teal);}
  .toggle-row button.on.gasto{background:var(--coral-dim); border-color:var(--coral); color:var(--coral);}
  .modal-actions{display:flex; gap:10px; margin-top:6px;}
  .btn-primary{
    flex:1; background:var(--teal); color:#0f1620; border:none;
    padding:13px; border-radius:10px; font-size:14px; font-weight:700; cursor:pointer;
  }
  .btn-secondary{
    background:none; border:1px solid var(--border); color:var(--ink-dim);
    padding:13px 18px; border-radius:10px; font-size:14px; cursor:pointer;
  }
  .row-2{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
  ::-webkit-scrollbar{width:0px;}

/* Cuenta Clara 2 — espacio de trabajo adaptable */
:root{--ink-faint:#a0acc5;--radius:16px;}
body{line-height:1.45;}
button,input,select,textarea{font:inherit;}
button{transition:background .16s,border-color .16s,transform .16s;}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--teal);outline-offset:3px;}
button:disabled{opacity:.5;cursor:not-allowed;}
[hidden]{display:none!important;}
#app{max-width:100%;border:0;}
main{min-width:0;}
.header-eyebrow{font-size:10px;letter-spacing:.15em;color:var(--ink-dim);margin:0 0 4px;}
.header-actions{display:flex;align-items:center;gap:20px;}
#headerSync{font-size:12px;color:var(--ink-dim);display:inline-flex;align-items:center;gap:8px;}
#headerSync::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--gold);}
#headerSync[data-state=guardado]::before{background:var(--teal);}
#headerSync[data-state=error]::before,#headerSync[data-state=conflicto]::before{background:var(--coral);}
#headerAdd{display:none;white-space:nowrap;font-size:13px;padding:11px 17px;}
.sidebar-brand{display:none;}
.currency-warning{font-size:13px;color:var(--gold);grid-column:1/-1;margin:0;}
.currency-warning:empty{display:none;}
.summary-widget{min-width:0;}
.summary-widget .section-title{margin-top:20px;}
.stat-card .val{font-size:clamp(12px,3.8vw,24px);overflow-wrap:anywhere;}
.stat-card .lbl{font-size:11px;}
.row-item{gap:12px;}
.row-item>div{min-width:0;}
.row-item .name,.tx-info .desc,.debt-name,.ct-name,.stat-info .sn{overflow-wrap:anywhere;}
.row-item .amt{flex-shrink:0;}
.tx-left{min-width:0;}
.tx-amt{font-size:13px;}
.tx-info .meta{line-height:1.5;overflow-wrap:anywhere;}
.panel{overflow:hidden;}
.debt-sub,.ct-sub{font-size:12px;line-height:1.5;}
.field input,.field select,.field textarea{font-size:16px;}
.checkbox-field label{display:flex;align-items:center;gap:10px;line-height:1.5;}
.checkbox-field input{width:18px!important;height:18px;flex:none;accent-color:var(--teal);}
.field small{display:block;color:var(--ink-dim);font-size:12px;margin-top:6px;}
.modal{padding-bottom:calc(24px + env(safe-area-inset-bottom));}
#conflictoPanel{position:sticky;top:0;z-index:35;background:var(--gold-dim);padding:18px;border:1px solid var(--gold);font-size:14px;}
#conflictoPanel button{padding:9px 12px;background:var(--surface);color:var(--ink);border:1px solid var(--gold);border-radius:8px;margin-right:8px;}
nav.tabbar{position:fixed;left:0;right:0;bottom:0;max-width:none;min-height:65px;}
nav.tabbar .secondary-tab{display:none;}
nav.tabbar button{font-size:11px;padding:10px 4px;min-height:60px;}
nav.tabbar [data-tab=resumen]{order:1;}
nav.tabbar [data-tab=movimientos]{order:2;}
nav.tabbar [data-tab=tarjetas]{order:3;}
nav.tabbar [data-tab=bancos]{order:4;}
nav.tabbar .nav-more{order:5;}
nav.tabbar.more-open .secondary-tab{display:flex;position:absolute;right:12px;width:190px;min-height:48px;flex-direction:row;padding:12px 18px;background:var(--surface-2);border:1px solid var(--border);gap:12px;font-size:14px;box-shadow:0 6px 20px #0005;}
nav.tabbar.more-open [data-tab=cuentas]{bottom:calc(70px + env(safe-area-inset-bottom));border-radius:0 0 12px 12px;}
nav.tabbar.more-open [data-tab=asistente]{bottom:calc(117px + env(safe-area-inset-bottom));}
nav.tabbar.more-open [data-tab=deudas]{bottom:calc(164px + env(safe-area-inset-bottom));border-radius:12px 12px 0 0;}
.fab{bottom:calc(84px + env(safe-area-inset-bottom));right:18px;left:auto;transform:none;}
#tab-asistente .chat-box{max-height:58vh;}
@media(min-width:700px) and (max-width:1023px){
 main{padding:24px 32px 120px;}
 #tab-resumen.active{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}
 #tab-resumen .grid-3,.widget-wide{grid-column:1/-1;}
 header{padding:24px 32px;}
 #headerAdd{display:block;}
}
@media(min-width:1024px){
 :root{--sidebar:232px;}
 #app{width:calc(100% - var(--sidebar));margin:0 0 0 var(--sidebar);min-height:100vh;}
 header{padding:26px 40px 22px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:rgba(13,21,36,.96);}
 header .brand{flex:1;gap:24px;}
 .brand h1{font-size:26px;letter-spacing:-.035em;}
 .header-eyebrow{font-size:10px;margin-bottom:7px;}
 #headerAdd{display:block;}
 .header-actions{gap:18px;}
 .month-nav{margin:0;gap:14px;order:2;}
 .month-label{font-size:13px;min-width:136px;white-space:nowrap;}
 .month-nav button{width:30px;height:32px;}
 main{padding:30px 40px 60px;width:100%;max-width:1600px;margin:0 auto;}
 nav.tabbar{width:var(--sidebar);position:fixed;inset:0 auto 0 0;max-width:none;margin:0;display:flex;flex-direction:column;justify-content:flex-start;gap:6px;padding:30px 16px;background:#101a2b;border-top:0;border-right:1px solid #26334b;backdrop-filter:none;}
 .sidebar-brand{display:flex;flex-direction:column;align-items:flex-start;padding:0 12px 34px;gap:4px;order:0;}
 .brand-symbol{display:flex;align-items:center;justify-content:center;width:38px;height:38px;background:var(--teal);color:#0d1524;font-size:27px;font-weight:700;border-radius:12px;margin-bottom:14px;}
 .brand-symbol span{color:#0d1524;}
 .sidebar-brand strong{font-family:'Space Grotesk',sans-serif;font-size:21px;letter-spacing:-.04em;}
 .sidebar-brand strong span{color:var(--teal);}
 .sidebar-brand small{font-size:11px;color:var(--ink-dim);margin-top:3px;}
 nav.tabbar button,nav.tabbar.more-open .secondary-tab{position:static;flex:0 0 auto;display:flex;width:100%;flex-direction:row;gap:14px;align-items:center;text-align:left;padding:13px 14px;border:1px solid transparent;border-radius:9px;font-size:13px;min-height:46px;box-shadow:none;background:none;order:initial;}
 nav.tabbar button .ic{font-size:19px;width:22px;text-align:center;line-height:1;}
 nav.tabbar button.active{background:#0c3a32;color:var(--teal);border-color:#145246;}
 nav.tabbar button:hover{background:var(--surface);}
 nav.tabbar button[data-tab=cuentas]{margin-top:auto;}
 nav.tabbar .nav-more{display:none;}
 .fab{display:none;}
 #tab-resumen.active{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:26px 24px;align-items:start;}
 #tab-resumen .grid-3{grid-column:1/-1;gap:18px;margin:0;}
 .stat-card{border-radius:14px;padding:22px 24px;background:linear-gradient(135deg,#19253e,#141f34);}
 .stat-card .lbl{font-size:11px;margin-bottom:14px;letter-spacing:.1em;}
 .stat-card .val{font-size:clamp(20px,2vw,32px);letter-spacing:-.04em;}
 .summary-widget .section-title{margin:0 0 14px;font-size:11px;letter-spacing:.07em;color:var(--ink-dim);}
 .widget-wide{grid-column:1/-1;}
 .summary-widget .panel{margin-bottom:0;}
 .summary-widget:has(#trendChart){grid-column:1;grid-row:2 / span 2;}
 .trend-chart{height:235px;padding:30px 22px 16px;border-radius:14px;}
 .trend-legend{justify-content:flex-end;margin-top:-29px;margin-bottom:16px;}
 .row-item{padding:15px 17px;}
 .row-item .name,.row-item .amt{font-size:14px;}
 #cardsList,#loansList,#cuotasList,#metasList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}
 .card-tile,.debt-tile{margin-bottom:0;padding:24px;}
 .card-tile .ct-name{font-size:18px;}
 .card-tile .ct-amount{font-size:30px;}
 .ct-actions button{padding:9px 11px;}
 .modal-overlay{align-items:center;padding:32px;}
 .modal{max-width:720px;border-radius:20px;max-height:90vh;padding:28px 30px;border:1px solid var(--border);box-shadow:0 24px 90px #0008;}
 .modal-handle{display:none;}
 .modal h2{font-size:23px;margin-bottom:25px;}
 .modal .field-row{gap:18px;}
 .modal-actions{position:sticky;bottom:-28px;background:var(--surface);padding:15px 0 0;}
 #tab-cuentas>.panel,#tab-cuentas>#saldosList{max-width:100%;}
 .backup-actions{display:flex;gap:12px;}
 .backup-actions>*{flex:1;}
 #tab-asistente{max-width:1000px;margin:0 auto;}
 #tab-asistente .chat-box{min-height:340px;padding:22px;}
 .chat-msg{font-size:15px;padding:14px 18px;line-height:1.7;}
 .table-scroll{overflow-x:auto;}
 .mov-table{width:100%;border-collapse:collapse;text-align:left;font-size:12px;}
 .mov-table th{padding:15px 12px;color:var(--ink-dim);font-weight:500;background:#111c30;font-size:11px;white-space:nowrap;}
 .mov-table td{padding:17px 12px;border-top:1px solid var(--border);vertical-align:middle;}
 .mov-table td:first-child{white-space:nowrap;color:var(--ink-dim);font-size:11px;}
 .mov-table td:nth-child(2){min-width:170px;max-width:270px;overflow-wrap:anywhere;}
 .mov-table strong{font-size:13px;font-weight:500;}
 .mov-table small{display:block;color:var(--ink-dim);font:11px 'Inter',sans-serif;margin-top:5px;}
 .align-right{text-align:right;white-space:nowrap;}
 .mov-table .ingreso{color:var(--teal);}.mov-table .gasto{color:var(--coral);}
 .table-actions{display:flex;gap:6px;}
 .table-actions button{font-size:11px;background:transparent;border:1px solid var(--border);border-radius:6px;padding:6px 8px;color:var(--ink-dim);}
 .status-badge{display:inline-block;padding:4px 8px;border-radius:6px;font-size:10px;background:var(--surface-2);white-space:nowrap;}
 .status-badge.posted{color:var(--teal);background:var(--teal-dim);}.status-badge.pending{color:var(--gold);background:var(--gold-dim);}
}
@media(min-width:1024px) and (max-width:1250px){
 :root{--sidebar:202px;}
 header,main{padding-left:24px;padding-right:24px;}
 #headerSync{display:none;}
 .month-label{min-width:110px;}
 .brand h1{font-size:23px;}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}
@media(min-width:1024px){
 nav.tabbar .secondary-tab{display:flex;}
 #tab-resumen.active{grid-auto-flow:dense;}
 .summary-widget:has(#trendChart){grid-row:2;grid-column:1;}
 .summary-widget:has(#disponibleCuentas){grid-row:2;grid-column:2;}
 .summary-widget:has(#sobregiroAlerta:empty){display:none;}
}
@media(min-width:1024px){
 nav.tabbar [data-tab]{order:0;}
 nav.tabbar button[data-tab=cuentas]{order:1;}
}
@media(max-width:699px){
 #tab-resumen .grid-3{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
 #tab-resumen .stat-card{padding:15px 12px;}
 #tab-resumen .stat-card:last-child{grid-column:1/-1;}
 .stat-card .val{font-size:clamp(16px,5vw,22px);letter-spacing:-.06em;}
 #tab-resumen .stat-card:last-child .val{font-size:26px;}
}
.abonos-history{margin-top:14px;font-size:12px;color:var(--ink-dim);}
.abonos-history summary{cursor:pointer;padding:8px 0;}
.abonos-history small{display:block;margin-top:4px;}
.abonos-history button{color:var(--coral);background:none;border:1px solid var(--border);padding:6px 10px;border-radius:6px;}
@media(max-width:699px){
 .tx-row{gap:10px;}
 .tx-right{flex:0 0 auto;max-width:47%;}
 .tx-amt{font-size:12px;white-space:normal;overflow-wrap:anywhere;}
 .tx-info{min-width:0;}
}
.update-app{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);z-index:100;background:var(--teal);color:#081f20;border:0;border-radius:10px;padding:14px 20px;box-shadow:0 4px 24px #0006;font-weight:600;}