:root{
  --bg:#F8FAFC;
  --surface:#FFFFFF;
  --surface-hover:#F1F5F9;
  --border:#E2E8F0;
  --text:#0F172A;
  --text-secondary:#64748B;
  --accent:#2563EB;
  --accent-dark:#1E3A5F;
  --accent-soft:#EFF6FF;
  --accent-contrast:#FFFFFF;
  --success:#16A34A;
  --success-soft:#F0FDF4;
  --warning:#D97706;
  --warning-soft:#FFFBEB;
  --danger:#DC2626;
  --danger-soft:#FEF2F2;
  --ia:#7C3AED;
  --shadow-sm: 0 1px 2px rgba(15,23,42,.06);
  --shadow-md: 0 4px 16px rgba(15,23,42,.08);
  --radius: 8px;
  --sidebar-w: 232px;
  --sidebar-w-collapsed: 68px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B1220;
    --surface:#111A2C;
    --surface-hover:#1A2740;
    --border:#243352;
    --text:#E7ECF5;
    --text-secondary:#93A3C0;
    --accent:#4C8DFF;
    --accent-dark:#B9D2FF;
    --accent-soft:#16294D;
    --accent-contrast:#08122A;
    --success:#3DD672;
    --success-soft:#0F2A1B;
    --warning:#F5A524;
    --warning-soft:#2E2308;
    --danger:#F0554F;
    --danger-soft:#301213;
    --ia:#A78BFA;
    --shadow-sm: 0 1px 2px rgba(0,0,0,.4);
    --shadow-md: 0 8px 24px rgba(0,0,0,.45);
  }
}
:root[data-theme="dark"]{
  --bg:#0B1220;
  --surface:#111A2C;
  --surface-hover:#1A2740;
  --border:#243352;
  --text:#E7ECF5;
  --text-secondary:#93A3C0;
  --accent:#4C8DFF;
  --accent-dark:#B9D2FF;
  --accent-soft:#16294D;
  --accent-contrast:#08122A;
  --success:#3DD672;
  --success-soft:#0F2A1B;
  --warning:#F5A524;
  --warning-soft:#2E2308;
  --danger:#F0554F;
  --danger-soft:#301213;
  --ia:#A78BFA;
  --shadow-sm: 0 1px 2px rgba(0,0,0,.4);
  --shadow-md: 0 8px 24px rgba(0,0,0,.45);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden}
body{
  background:var(--bg);
  color:var(--text);
  font-family:"Inter",-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:14px;
  line-height:1.45;
  -webkit-font-smoothing:antialiased;
  width:100%;
}
button,input,select{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3{margin:0;text-wrap:balance;font-weight:600;letter-spacing:-.01em}
table{border-collapse:collapse;width:100%}
.num, .num-input, td.num, th.num{font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

.boot-overlay{position:fixed;inset:0;background:var(--bg);color:var(--text-secondary);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;z-index:500;font-weight:600}
.boot-spin{animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.ia-accent{color:var(--ia);font-weight:800}

.login-card{width:340px;max-width:calc(100vw - 40px);background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:28px 26px;box-shadow:var(--shadow-md);display:flex;flex-direction:column;gap:12px}
.login-brand{display:flex;align-items:center;justify-content:center;gap:9px;font-size:17px;font-weight:700}
.login-brand .brand-mark{width:30px;height:30px;border-radius:7px;background:var(--accent-dark);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12.5px}
.login-sub{color:var(--text-secondary);font-size:13px;text-align:center;margin:-4px 0 4px}
.login-field{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:600;color:var(--text-secondary)}
.login-field input{border:1px solid var(--border);border-radius:6px;padding:9px 11px;background:var(--bg);color:var(--text);font-weight:500;font-size:13.5px;width:100%}
.login-field input:focus{border-color:var(--accent);background:var(--surface)}

.pass-wrap{position:relative;display:block}
.pass-wrap input{padding-right:38px!important;width:100%}
.pass-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-secondary);width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:6px}
.pass-toggle:hover{background:var(--surface-hover);color:var(--text)}
.login-submit{width:100%;justify-content:center;margin-top:4px}
.login-error{color:var(--danger);font-size:12.5px;font-weight:600;text-align:center;min-height:15px;margin:0}

.ic{width:18px;height:18px;flex:none}
.ic-sm{width:14px;height:14px}
.ic-lg{width:34px;height:34px;color:var(--accent)}

#app{display:flex;min-height:100vh}

/* ---------- Sidebar ---------- */
.sidebar{
  width:var(--sidebar-w);
  flex:none;
  background:var(--surface);
  border-right:1px solid var(--border);
  display:flex;
  flex-direction:column;
  position:fixed;
  top:0;left:0;bottom:0;
  z-index:40;
  transition:width .18s ease, transform .18s ease;
}
body.sidebar-collapsed .sidebar{width:var(--sidebar-w-collapsed)}
body.sidebar-collapsed .brand-name,
body.sidebar-collapsed .nav-item span,
body.sidebar-collapsed .who{display:none}
body.sidebar-collapsed .sidebar-collapse svg{transform:rotate(180deg)}
body.sidebar-collapsed .shell{margin-left:var(--sidebar-w-collapsed)}

.brand{display:flex;align-items:center;gap:10px;padding:18px 16px;border-bottom:1px solid var(--border);position:relative}
.brand-mark{width:30px;height:30px;border-radius:7px;background:var(--accent-dark);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12.5px;flex:none}
.brand-name{font-weight:700;font-size:15px;letter-spacing:-.01em;white-space:nowrap}
.sidebar-collapse{margin-left:auto;background:none;border:none;color:var(--text-secondary);padding:4px;border-radius:6px;display:flex}
.sidebar-collapse:hover{background:var(--surface-hover)}

.nav{display:flex;flex-direction:column;gap:2px;padding:12px 10px;flex:1}
.nav-item{
  display:flex;align-items:center;gap:11px;
  padding:9px 11px;border-radius:7px;border:none;background:none;
  text-align:left;color:var(--text-secondary);font-weight:500;
  position:relative;white-space:nowrap;
}
.nav-item:hover{background:var(--surface-hover);color:var(--text)}
.nav-item.is-active{background:var(--accent-soft);color:var(--accent)}
.nav-item.is-active::before{content:"";position:absolute;left:-10px;top:6px;bottom:6px;width:3px;border-radius:2px;background:var(--accent)}
.nav-item.is-active svg{color:var(--accent)}

.sidebar-foot{padding:12px 16px 14px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:10px}
.who-row{display:flex;align-items:center;gap:10px}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:12px;flex:none}
.who-name{font-weight:600;font-size:13px}
.who-role{color:var(--text-secondary);font-size:12px}

/* ---------- Shell / topbar ---------- */
.shell{flex:1;margin-left:var(--sidebar-w);min-width:0;transition:margin-left .18s ease}
.topbar{
  height:60px;display:flex;align-items:center;gap:14px;
  padding:0 24px;background:var(--surface);border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:30;
}
.breadcrumb{font-size:13px;color:var(--text-secondary);font-weight:500}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:12px}
.search{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--border);border-radius:7px;padding:7px 11px;color:var(--text-secondary);width:300px}
.search input{border:none;background:none;outline:none;width:100%;color:var(--text)}
.search-inline{width:320px}
.icon-btn{background:none;border:1px solid transparent;color:var(--text-secondary);border-radius:7px;width:32px;height:32px;display:flex;align-items:center;justify-content:center}
.icon-btn:hover{background:var(--surface-hover);color:var(--text)}
.only-mobile{display:none}

.main{padding:26px 28px 60px;max-width:1400px}
.view{display:none}
.view.is-active{display:block}

/* ---------- Headings / page head ---------- */
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px}
.page-head h1{font-size:22px}
.page-sub{color:var(--text-secondary);margin:4px 0 0;font-size:13.5px}
.head-actions{display:flex;gap:10px}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:7px;padding:0 14px;height:36px;border-radius:7px;border:1px solid transparent;font-weight:600;font-size:13.5px;white-space:nowrap;text-decoration:none}
.btn-sm{height:31px;padding:0 11px;font-size:13px}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-dark)}
.btn-secondary{background:var(--surface);border-color:var(--border);color:var(--text)}
.btn-secondary:hover{background:var(--surface-hover)}
.btn-ghost{background:none;border-color:var(--border);color:var(--text-secondary)}
.btn-ghost:hover{background:var(--surface-hover);color:var(--text)}
.btn-danger{background:var(--danger);color:#fff}
.btn[disabled]{opacity:.45;cursor:not-allowed}

/* ---------- KPI row ---------- */
.kpi-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:22px}
.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow-sm)}
.kpi-label{font-size:12.5px;color:var(--text-secondary);font-weight:500}
.kpi-value{font-size:24px;font-weight:700;margin-top:6px;font-variant-numeric:tabular-nums}
.kpi-warning .kpi-value{color:var(--warning)}
.kpi-danger .kpi-value{color:var(--danger)}
.kpi-success .kpi-value{color:var(--success)}

/* ---------- Panels ---------- */
.split-2{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.panel-head{padding:14px 18px;border-bottom:1px solid var(--border)}
.panel-head h2{font-size:14.5px}

.mini-table{font-size:13px}
.mini-table th{text-align:left;color:var(--text-secondary);font-weight:500;font-size:11.5px;text-transform:uppercase;letter-spacing:.03em;padding:9px 18px;border-bottom:1px solid var(--border)}
.mini-table td{padding:11px 18px;border-bottom:1px solid var(--border)}
.mini-table tr:last-child td{border-bottom:none}
.mini-table .num{text-align:right}
.empty-row td{color:var(--text-secondary);text-align:center;padding:22px}

.pending-list{list-style:none;margin:0;padding:8px}
.pending-list li{display:flex;align-items:center;gap:11px;padding:10px 10px;border-radius:7px}
.pending-list li:hover{background:var(--surface-hover)}
.pending-list .pl-info{flex:1;min-width:0}
.pending-list .pl-title{font-weight:600;font-size:13px}
.pending-list .pl-sub{color:var(--text-secondary);font-size:12px;margin-top:1px}
.pending-list .empty{color:var(--text-secondary);padding:14px;font-size:13px}

/* ---------- Badges / estados ---------- */
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:3px 9px 3px 7px;border-radius:100px}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.badge-pendiente{background:var(--warning-soft);color:var(--warning)}
.badge-aprobado{background:var(--success-soft);color:var(--success)}
.badge-procesando{background:var(--accent-soft);color:var(--accent)}
.badge-error{background:var(--danger-soft);color:var(--danger)}
.badge-vacio{background:var(--surface-hover);color:var(--text-secondary)}
.badge-ai{background:var(--accent-soft);color:var(--accent)}
.badge-ai::before{display:none}

/* ---------- Data table (clientes) ---------- */
.table-toolbar{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--border)}
.table-wrap{overflow-x:auto}
.data-table{font-size:13.5px;min-width:720px}
.data-table th{text-align:left;color:var(--text-secondary);font-weight:500;font-size:11.5px;text-transform:uppercase;letter-spacing:.03em;padding:10px 18px;border-bottom:1px solid var(--border);background:var(--surface)}
.data-table td{padding:12px 18px;border-bottom:1px solid var(--border);vertical-align:middle}
.data-table tbody tr:hover{background:var(--surface-hover)}
.data-table .num{text-align:right}
.client-name-cell{display:flex;align-items:center;gap:10px}
.client-dot{width:30px;height:30px;border-radius:8px;background:var(--accent-soft);color:var(--accent-dark);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11.5px;flex:none}
.client-name{font-weight:600}
.row-link{background:none;border:none;color:var(--accent);font-weight:600;padding:0;cursor:pointer}
.row-actions{display:flex;gap:4px;justify-content:flex-end}
/* En una celda de tabla, display:flex la saca del layout de tabla y corta las lineas divisorias. */
td.row-actions:not(.stk){display:table-cell;text-align:right;white-space:nowrap}
td.row-actions:not(.stk) .icon-btn{display:inline-flex;vertical-align:middle;margin-left:4px}
.table-foot{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-top:1px solid var(--border)}
.muted{color:var(--text-secondary);font-size:12.5px}

/* ---------- Historial ---------- */
.back-link{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--text-secondary);font-weight:600;font-size:13px;padding:0 0 16px;margin-top:-4px}
.back-link:hover{color:var(--accent)}
.client-head{display:flex;align-items:center;gap:14px;margin-bottom:24px}
.client-avatar{width:44px;height:44px;border-radius:10px;background:var(--accent-dark);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:15px}
.client-head h1{font-size:20px}

.year-block{margin-bottom:22px}
.year-title{font-size:13px;font-weight:700;color:var(--text-secondary);letter-spacing:.02em;margin:0 0 10px}
.month-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.month-card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;text-align:left;cursor:pointer}
.month-card:hover{border-color:var(--accent);box-shadow:var(--shadow-sm)}
.month-card-delete{position:absolute;top:8px;right:8px;opacity:0;transition:opacity .12s}
.month-card:hover .month-card-delete{opacity:1}
.month-name{font-weight:600;font-size:14.5px;padding-right:28px}
.month-count{color:var(--text-secondary);font-size:12.5px;margin-top:3px}
.month-status{margin-top:10px}
.empty-state{color:var(--text-secondary);padding:30px 0;text-align:center;font-size:13.5px}

.tipo-tabs{display:flex;gap:6px;margin-bottom:16px;border-bottom:1px solid var(--border)}
.tipo-tab{background:none;border:none;border-bottom:2px solid transparent;padding:10px 4px;margin-bottom:-1px;font-weight:600;font-size:14px;color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;gap:7px}
.tipo-tab:hover{color:var(--text)}
.tipo-tab.is-active{color:var(--accent);border-bottom-color:var(--accent)}
.tipo-tab-count{background:var(--surface-hover);color:var(--text-secondary);border-radius:100px;padding:1px 8px;font-size:12px;font-weight:700}
.tipo-tab.is-active .tipo-tab-count{background:var(--accent-soft);color:var(--accent)}

/* ---------- Período ---------- */
.breadcrumb-inline{font-size:13px;color:var(--text-secondary);margin-bottom:10px}
.breadcrumb-inline a{color:var(--text-secondary);text-decoration:none;cursor:pointer}
.breadcrumb-inline a:hover{color:var(--accent)}
.breadcrumb-inline .crumb-current{color:var(--text);font-weight:600}
.stat-strip{display:flex;gap:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:18px;overflow:hidden}
.stat{flex:1;padding:14px 18px;border-right:1px solid var(--border);display:flex;flex-direction:column;gap:3px}
.stat:last-child{border-right:none}
.stat-num{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}
.stat-label{font-size:12px;color:var(--text-secondary);font-weight:500}
.stat-warning .stat-num{color:var(--warning)}
.stat-success .stat-num{color:var(--success)}
.stat-danger .stat-num{color:var(--danger)}

.grid-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:10px;min-height:38px}
.save-bar{margin-left:auto;display:none;align-items:center;gap:12px;background:var(--warning-soft);color:var(--warning);padding:6px 8px 6px 14px;border-radius:8px;font-weight:600;font-size:13px}
.save-bar.is-visible{display:flex}

/* ---------- Comprobantes grid ---------- */
.grid-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:auto;max-height:62vh}
.comp-table{font-size:13px;min-width:2170px;table-layout:fixed}
.comp-table th{position:sticky;top:0;text-align:left;color:var(--text-secondary);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.03em;padding:10px 14px;border-bottom:1px solid var(--border);background:var(--bg);z-index:2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.comp-table td{padding:9px 14px;border-bottom:1px solid var(--border);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.comp-table td.num, .comp-table th.num{text-align:right;font-variant-numeric:tabular-nums}
.comp-table tbody tr:hover td{background:var(--surface-hover)}
.comp-table td[contenteditable="true"]{cursor:text;border-radius:5px}
.comp-table td[contenteditable="true"]:hover{background:var(--accent-soft)}
.comp-table td[contenteditable="true"]:focus{background:var(--surface);outline:2px solid var(--accent);outline-offset:-2px;overflow-x:auto;text-overflow:clip}
.comp-table tr.is-editing td:not(.stk){background:var(--accent-soft)}
.comp-table tr.is-editing .stk{background:var(--accent-soft)}
.comp-table tr.is-dirty td:not(.stk){background:var(--warning-soft)}

.stk{position:sticky;background:var(--surface);z-index:1}
.comp-table thead .stk{z-index:3;background:var(--bg)}
.stk-1{left:0;width:110px}
.stk-2{left:110px;width:100px}
.stk-3{left:210px;width:110px}
.stk-4{left:320px;width:200px;box-shadow:2px 0 4px rgba(15,23,42,.06)}
.stk-right{right:0;left:auto;width:180px;box-shadow:-2px 0 4px rgba(15,23,42,.06)}
.comp-table tbody tr:hover .stk{background:var(--surface-hover)}
.comp-table tr.is-dirty .stk{background:var(--warning-soft)}

.row-review-btn{background:none;border:1px solid var(--border);color:var(--text-secondary);border-radius:6px;padding:4px 9px;font-size:12px;font-weight:600}
.row-review-btn:hover{color:var(--accent);border-color:var(--accent)}

/* ---------- Revisión ---------- */
.review-layout{display:grid;grid-template-columns:1fr 1.35fr;gap:18px;align-items:stretch;height:calc(100vh - 180px);min-height:460px}
.review-image{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;min-height:0}
.review-image-head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--border);font-size:12.5px;color:var(--text-secondary);flex:none}
.zoom-controls{display:flex;align-items:center;gap:8px;font-variant-numeric:tabular-nums}
.review-image-canvas{flex:1;min-height:0;overflow:auto;background:var(--bg);display:flex;align-items:center;justify-content:center}
.receipt-img{max-width:100%;transition:transform .12s ease}
body.role-asistente [data-nav="exportaciones"],body.role-asistente [data-nav="configuracion"],
body.role-asistente #newClientBtn,body.role-asistente #editClientBtn,body.role-asistente #newPeriodBtn,body.role-asistente #exportBtn,
body.role-asistente [data-edit],body.role-asistente [data-delete],body.role-asistente [data-edit-row],body.role-asistente [data-delete-comp],
body.role-asistente .row-review-btn,body.role-asistente .month-card-delete,body.role-asistente #saveBar{display:none !important}
.same-photo{display:flex;align-items:center;gap:6px;margin:-4px 0 10px;font-size:13px;font-weight:600;color:var(--accent)}
.same-photo .icon-btn{width:28px;height:28px}
.review-layout.no-photo{grid-template-columns:minmax(0,760px)}
.review-layout.no-photo .review-image{display:none}
.no-photo-msg{display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--text-secondary);font-size:13.5px}
.no-photo-msg p{margin:0}
.receipt-mock{
  width:340px;min-height:480px;background:var(--surface);border:1px solid var(--border);
  box-shadow:var(--shadow-md);padding:22px;transition:transform .12s ease;
  font-size:11px;color:var(--text);
}
.receipt-mock .rl{height:8px;background:var(--border);border-radius:3px;margin-bottom:10px}
.receipt-mock .rl.w60{width:60%}
.receipt-mock .rl.w40{width:40%}
.receipt-mock .rl.w80{width:80%}
.receipt-mock .rl.w30{width:30%}
.receipt-mock .rl.tall{height:20px;background:var(--accent-soft)}

.review-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column;min-height:0}
.review-form-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;flex:none}
.low-confidence-note{display:flex;align-items:center;gap:6px;background:var(--warning-soft);color:var(--warning);font-size:12.5px;font-weight:600;padding:8px 11px;border-radius:7px;margin:0 0 16px;flex:none}
.review-form-head h2{font-size:15px}
.review-form-body{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden}
.field-group{margin-bottom:18px}
.field-group h3{font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary);margin-bottom:9px;font-weight:700}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.field-grid label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:600;color:var(--text-secondary)}
.field-grid input, .field-grid select{border:1px solid var(--border);border-radius:6px;padding:8px 10px;background:var(--bg);color:var(--text);font-weight:500;font-size:13.5px}
.field-grid input:focus, .field-grid select:focus{border-color:var(--accent);background:var(--surface)}
.field-grid input:disabled{opacity:.6}
.field-grid .num-input{text-align:right;font-variant-numeric:tabular-nums}
.field-warn{grid-column:1/-1}
.field-warn.is-flagged input{border-color:var(--warning);background:var(--warning-soft)}
.warn-flag{display:none;align-items:center;gap:4px;color:var(--warning);font-weight:700;margin-left:6px;font-size:11px}
.field-warn.is-flagged .warn-flag{display:inline-flex}
.review-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:0;padding-top:14px;border-top:1px solid var(--border);flex:none}

/* ---------- Modales ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(11,18,32,.44);display:none;align-items:center;justify-content:center;z-index:100;padding:20px}
.modal-overlay.is-open{display:flex}
.modal{background:var(--surface);border-radius:12px;width:480px;max-width:100%;max-height:88vh;display:flex;flex-direction:column;box-shadow:var(--shadow-md)}
.modal-lg{width:620px}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}
.modal-head h2{font-size:16px}
.modal-body{padding:20px;overflow-y:auto}
.modal-foot{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid var(--border)}
#uploadSummary{margin-right:auto}

.dropzone{border:1.5px dashed var(--border);border-radius:10px;padding:30px 20px;text-align:center;background:var(--bg)}
.dropzone.is-dragover{border-color:var(--accent);background:var(--accent-soft)}
.dz-title{font-weight:600;margin:12px 0 3px}
.dz-sub{color:var(--text-secondary);font-size:12.5px;margin:0 0 14px}
.dz-formats{color:var(--text-secondary);font-size:11.5px;margin-top:12px;letter-spacing:.02em}

.upload-list{margin-top:16px;display:flex;flex-direction:column;gap:8px}
.upload-row{display:flex;align-items:center;gap:11px;padding:9px 11px;border:1px solid var(--border);border-radius:8px}
.upload-thumb{width:34px;height:34px;border-radius:6px;background:var(--accent-soft);color:var(--accent-dark);display:flex;align-items:center;justify-content:center;flex:none}
.upload-info{flex:1;min-width:0}
.upload-name{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.upload-progress{height:4px;background:var(--border);border-radius:3px;margin-top:6px;overflow:hidden}
.upload-progress-bar{height:100%;background:var(--accent);width:0%;transition:width .3s ease}
.upload-status{font-size:11.5px;font-weight:700;flex:none}

.export-summary{display:flex;flex-direction:column;gap:2px}
.es-row{display:flex;justify-content:space-between;padding:11px 2px;border-bottom:1px solid var(--border);font-size:13.5px}
.es-row:last-child{border-bottom:none}
.text-success{color:var(--success)}

/* ---------- Toasts ---------- */
.toast-stack{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:200}
.toast{display:flex;align-items:center;gap:9px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-md);border-radius:8px;padding:11px 16px;font-size:13px;font-weight:600;min-width:220px;animation:toast-in .18s ease}
.toast svg{color:var(--success);flex:none}
.toast.is-error svg{color:var(--danger)}
@keyframes toast-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* ---------- Responsive ---------- */
@media (max-width: 980px){
  .split-2{grid-template-columns:1fr}
  .review-layout{grid-template-columns:1fr;height:auto;min-height:0}
  .review-image{height:60vh}
  .review-form{height:auto;max-height:70vh}
  .kpi-row{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 760px){
  .sidebar{transform:translateX(-100%);width:240px}
  body.sidebar-collapsed .sidebar{transform:translateX(0);width:240px}
  body.sidebar-collapsed .brand-name, body.sidebar-collapsed .nav-item span, body.sidebar-collapsed .who{display:block}
  .shell{margin-left:0}
  body.sidebar-collapsed .shell{margin-left:0}
  .only-mobile{display:flex}
  .sidebar-collapse{display:none}
  .search{width:180px}
  .kpi-row{grid-template-columns:1fr 1fr}
  .main{padding:18px 14px 50px}
  .page-head{flex-direction:column;align-items:flex-start}
  .field-grid{grid-template-columns:1fr}
}