:root{
  --sena:#39A900;
  --sena-dark:#007832;
  --navy:#00304D;
  --purple:#71277A;
  --yellow:#FDC300;
  --cyan:#50E5F9;
  --bg:#F6F6F6;
  --surface:#FFFFFF;
  --ink:#1F2937;
  --muted:#667085;
  --line:#DDE3E8;
  --danger:#B42318;
  --danger-bg:#FEF3F2;
  --warning:#9A6700;
  --warning-bg:#FFF7D6;
  --success:#027A48;
  --success-bg:#ECFDF3;
  --radius:16px;
  --shadow:0 10px 30px rgba(0,48,77,.08);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:"Work Sans",Calibri,Arial,sans-serif}
body{overflow-x:hidden}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.5}
.app-shell{min-height:100vh;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:78px;padding:10px clamp(16px,3vw,36px);background:#fff;border-bottom:1px solid var(--line);box-shadow:0 3px 16px rgba(0,48,77,.06)}
.brand{display:flex;align-items:center;gap:16px;min-width:0}
.brand img{width:58px;height:auto;display:block;flex:0 0 auto}
.brand-copy{min-width:0}
.brand-kicker{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--sena-dark);font-weight:700}
.brand-title{font-size:clamp(1rem,2vw,1.3rem);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.header-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:var(--success-bg);color:var(--success);font-size:.75rem;font-weight:700;border:1px solid #ABEFC6}
.btn{border:1px solid transparent;border-radius:10px;padding:10px 14px;font-weight:650;line-height:1;min-height:40px;background:#fff;color:var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:.16s ease}
.btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 5px 16px rgba(0,48,77,.1)}
.btn-primary{background:var(--sena);color:#fff;border-color:var(--sena)}
.btn-primary:hover:not(:disabled){background:#2f8f00}
.btn-secondary{border-color:#B8C4CC;color:var(--navy)}
.btn-ghost{border-color:transparent;background:transparent;color:var(--navy)}
.btn-danger{border-color:#FDA29B;color:var(--danger);background:#fff}
.btn-sm{padding:8px 10px;min-height:34px;font-size:.83rem}
main{width:min(1520px,100%);margin:0 auto;padding:clamp(16px,2.6vw,34px);flex:1}
.hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:24px;align-items:stretch}
.hero-copy,.upload-card,.panel,.kpi-card,.notice,.quality-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.hero-copy{padding:clamp(24px,4vw,48px);position:relative;overflow:hidden}
.hero-copy:after{content:"";position:absolute;right:-70px;bottom:-110px;width:260px;height:260px;border-radius:50%;border:42px solid rgba(57,169,0,.08)}
.hero-copy h1{font-size:clamp(2rem,4vw,3.35rem);line-height:1.02;margin:8px 0 16px;max-width:780px;letter-spacing:-.035em;color:var(--navy)}
.hero-copy p{font-size:clamp(1rem,1.8vw,1.15rem);line-height:1.55;color:var(--muted);max-width:760px;margin:0 0 20px}
.eyebrow{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:var(--sena-dark)}
.feature-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.feature-chip{border-radius:999px;padding:8px 11px;background:#F2F9EF;color:#285D12;border:1px solid #D7EFCB;font-size:.82rem;font-weight:650}
.upload-card{padding:22px;display:flex;flex-direction:column;gap:14px}
.upload-card h2{margin:0;font-size:1.15rem;color:var(--navy)}
.dropzone{flex:1;min-height:230px;border:2px dashed #9BC98A;border-radius:14px;background:linear-gradient(180deg,#FBFEFA,#F4FAF1);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px;transition:.18s ease}
.dropzone.dragover{border-color:var(--sena);background:#ECF8E7;transform:scale(1.01)}
.drop-icon{width:58px;height:58px;border-radius:16px;background:var(--sena);color:#fff;display:grid;place-items:center;font-size:1.6rem;font-weight:800;margin-bottom:14px}
.dropzone strong{color:var(--navy);font-size:1rem}
.dropzone small{display:block;color:var(--muted);margin-top:6px;line-height:1.4}
.privacy-note{display:flex;gap:9px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:#F8FAFC;color:#475467;font-size:.78rem;line-height:1.4}
.hidden{display:none!important}
.dashboard{display:flex;flex-direction:column;gap:18px}
.dashboard-header{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.dashboard-header h2{margin:0;color:var(--navy);font-size:1.45rem}
.source-summary{color:var(--muted);font-size:.84rem;margin-top:4px}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.filters{padding:16px}
.filter-grid{display:grid;grid-template-columns:minmax(180px,1.35fr) repeat(6,minmax(120px,1fr));gap:12px;align-items:end}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field label{font-size:.75rem;font-weight:750;color:#475467}
.field input,.field select,.field textarea{width:100%;border:1px solid #BCC7CF;border-radius:9px;background:#fff;color:var(--ink);padding:9px 10px;min-height:40px;outline:none}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--sena);box-shadow:0 0 0 3px rgba(57,169,0,.13)}
.filter-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.check{display:inline-flex;align-items:center;gap:8px;min-height:40px;font-size:.8rem;color:#475467}
.check input{width:17px;height:17px;accent-color:var(--sena)}
.kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.kpi-card{padding:15px 16px;box-shadow:none;position:relative;overflow:hidden}
.kpi-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--sena)}
.kpi-label{color:var(--muted);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.kpi-value{font-size:clamp(1.25rem,2.3vw,1.85rem);font-weight:800;color:var(--navy);margin-top:6px;line-height:1.1}
.kpi-sub{font-size:.72rem;color:var(--muted);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.panel{padding:16px;box-shadow:none;min-width:0}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}
.panel h3{font-size:1rem;margin:0;color:var(--navy)}
.panel-sub{font-size:.75rem;color:var(--muted)}
.status-stack{height:22px;border-radius:999px;background:#EAEFF2;overflow:hidden;display:flex;margin:6px 0 16px}
.status-seg{height:100%;min-width:0;transition:width .2s ease}
.status-no{background:#D92D20}.status-reported{background:var(--sena)}.status-empty{background:#98A2B3}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.75rem;color:#475467}
.legend-item{display:inline-flex;align-items:center;gap:6px}
.legend-dot{width:9px;height:9px;border-radius:50%}
.bar-list{display:flex;flex-direction:column;gap:10px}
.bar-item{display:grid;grid-template-columns:minmax(120px,1.5fr) minmax(90px,2fr) auto;gap:10px;align-items:center;font-size:.77rem}
.bar-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#344054}
.bar-track{height:9px;border-radius:999px;background:#EEF2F4;overflow:hidden}
.bar-fill{height:100%;background:var(--sena);border-radius:999px}
.bar-value{font-variant-numeric:tabular-nums;color:var(--navy);font-weight:750}

.status-panel{padding-bottom:15px}
.charts-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.chart-panel{min-height:360px}
.chart-shell{width:100%;min-height:270px;display:flex;flex-direction:column;justify-content:center}
.bar-chart{display:block;width:100%;height:auto;min-height:245px;overflow:visible}
.chart-track{fill:#EEF2F4}
.chart-bar{fill:var(--sena)}
.chart-label{font:600 12px "Work Sans",Calibri,Arial,sans-serif;fill:#344054}
.chart-value{font:800 12px "Work Sans",Calibri,Arial,sans-serif;fill:var(--navy)}
.chart-note{font-size:.72rem;color:var(--muted);margin-top:6px;line-height:1.35}
.timeline-panel{min-height:390px}
.timeline-shell{width:100%;min-height:300px;display:flex;flex-direction:column;justify-content:center}
.timeline-chart{display:block;width:100%;height:auto;min-height:280px;overflow:visible}
.chart-gridline{stroke:#E6EAED;stroke-width:1}
.chart-axis-line{stroke:#98A2B3;stroke-width:1}
.chart-axis-label{font:600 11px "Work Sans",Calibri,Arial,sans-serif;fill:#667085}
.timeline-line{fill:none;stroke:var(--sena);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.timeline-point{fill:#fff;stroke:var(--sena-dark);stroke-width:2}
.quality-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.quality-card{padding:12px 14px;box-shadow:none;border-radius:12px}
.quality-card strong{display:block;font-size:1.15rem;color:var(--navy);margin-bottom:3px}
.quality-card span{font-size:.72rem;color:var(--muted);line-height:1.25}
.tabs{display:flex;gap:4px;overflow:auto;padding:4px;background:#E9EEF1;border-radius:12px;width:max-content;max-width:100%}
.tab{border:0;background:transparent;padding:9px 13px;border-radius:9px;color:#475467;font-weight:700;font-size:.8rem;white-space:nowrap}
.tab.active{background:#fff;color:var(--navy);box-shadow:0 2px 7px rgba(0,48,77,.09)}
.table-panel{padding:0;overflow:hidden}
.table-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.table-title{font-weight:800;color:var(--navy);font-size:.95rem}
.table-count{font-size:.76rem;color:var(--muted)}
.table-wrap{width:100%;overflow:auto;max-height:570px}
table{border-collapse:separate;border-spacing:0;width:100%;min-width:980px;font-size:.77rem}
th{position:sticky;top:0;z-index:2;background:#F4F7F8;color:#344054;text-align:left;padding:10px 12px;border-bottom:1px solid #CBD5DC;font-size:.7rem;text-transform:uppercase;letter-spacing:.025em;white-space:nowrap}
td{padding:9px 12px;border-bottom:1px solid #EDF0F2;vertical-align:top;color:#344054;line-height:1.35}
tbody tr:hover td{background:#FBFDFB}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.status-pill{display:inline-flex;align-items:center;border-radius:999px;padding:4px 7px;font-weight:750;font-size:.68rem;white-space:nowrap}
.status-pill.no{color:#B42318;background:#FEF3F2}.status-pill.reported{color:#027A48;background:#ECFDF3}.status-pill.empty{color:#475467;background:#F2F4F7}
.pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-top:1px solid var(--line);background:#fff;flex-wrap:wrap}
.page-info{font-size:.76rem;color:var(--muted)}
.page-actions{display:flex;gap:6px}
.notice{padding:12px 14px;display:flex;gap:10px;align-items:flex-start;box-shadow:none;background:#FFFDF4;border-color:#F5DC8A}
.notice strong{display:block;color:#7A4F00;font-size:.8rem;margin-bottom:2px}.notice p{margin:0;color:#735B25;font-size:.76rem;line-height:1.4}
.toast-area{position:fixed;right:18px;bottom:18px;z-index:80;display:flex;flex-direction:column;gap:8px;max-width:min(390px,calc(100vw - 36px))}
.toast{background:#101828;color:#fff;padding:12px 14px;border-radius:11px;box-shadow:0 12px 32px rgba(16,24,40,.25);font-size:.82rem;line-height:1.35;animation:toastIn .18s ease}
.toast.error{background:#912018}.toast.success{background:#05603A}
@keyframes toastIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,25,41,.55);display:grid;place-items:center;padding:18px;z-index:70}
.modal{width:min(680px,100%);max-height:min(84vh,760px);overflow:auto;background:#fff;border-radius:18px;box-shadow:0 28px 80px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.5)}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 19px;border-bottom:1px solid var(--line)}
.modal-head h3{margin:0;color:var(--navy);font-size:1.05rem}
.icon-btn{width:36px;height:36px;border-radius:9px;border:1px solid var(--line);background:#fff;color:#475467;font-weight:800}
.modal-body{padding:18px 19px;line-height:1.5;font-size:.86rem;color:#344054}
.modal-body h4{color:var(--navy);margin:14px 0 7px}.modal-body h4:first-child{margin-top:0}.modal-body ul{padding-left:19px}
.modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:14px 19px;border-top:1px solid var(--line);flex-wrap:wrap}
.progress-overlay{position:fixed;inset:0;background:rgba(255,255,255,.88);z-index:90;display:grid;place-items:center;padding:20px}
.progress-card{width:min(420px,100%);background:#fff;border-radius:16px;border:1px solid var(--line);box-shadow:var(--shadow);padding:22px;text-align:center}
.spinner{width:38px;height:38px;border:4px solid #DDE8D7;border-top-color:var(--sena);border-radius:50%;margin:0 auto 13px;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.progress-card strong{display:block;color:var(--navy);margin-bottom:5px}.progress-card span{font-size:.79rem;color:var(--muted)}
.footer{padding:20px clamp(16px,3vw,36px);border-top:1px solid var(--line);background:#fff;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;color:#667085;font-size:.74rem}
.footer strong{color:var(--sena-dark)}
.empty-state{padding:44px 18px;text-align:center;color:var(--muted)}
.empty-state strong{display:block;color:var(--navy);font-size:1rem;margin-bottom:4px}
@media(max-width:1180px){.kpi-grid{grid-template-columns:repeat(3,1fr)}.filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.quality-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.charts-grid{grid-template-columns:1fr}.chart-panel{min-height:340px}}
@media(max-width:820px){.topbar{position:relative;align-items:flex-start}.hero{grid-template-columns:1fr}.brand-title{white-space:normal}.header-actions .badge{display:none}.filter-grid{grid-template-columns:1fr 1fr}.kpi-grid{grid-template-columns:1fr 1fr}.bar-item{grid-template-columns:minmax(110px,1fr) minmax(80px,1.3fr) auto}.timeline-panel{min-height:330px}.timeline-chart{min-height:240px}}
@media(max-width:560px){main{padding:12px}.topbar{padding:10px 12px}.brand img{width:52px}.brand-title{font-size:.95rem}.header-actions .btn span.btn-label{display:none}.hero-copy{padding:24px 20px}.upload-card{padding:16px}.filter-grid{grid-template-columns:1fr}.kpi-grid{grid-template-columns:1fr 1fr;gap:8px}.kpi-card{padding:12px}.quality-grid{grid-template-columns:1fr 1fr}.actions{width:100%}.actions .btn{flex:1}.table-toolbar{align-items:flex-start}.footer{padding:18px 14px}.modal-backdrop{padding:8px}.modal{max-height:94vh;border-radius:14px}}
@media print{.topbar,.footer,.actions,.filters,.tabs,.pagination{display:none!important}body{background:#fff}.panel,.kpi-card,.quality-card{box-shadow:none}}


/* v1.4.0 - analitica interactiva, calidad, paginacion numerica y tablas ordenables */
.quality-control{padding-bottom:14px}
.quality-control-head{align-items:flex-start}
.quality-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.quality-summary{display:flex;gap:8px;flex-wrap:wrap}
.quality-chip{display:inline-flex;align-items:center;gap:5px;border:1px solid #D8E0E5;background:#F8FAFC;border-radius:999px;padding:7px 10px;font-size:.76rem;color:#475467}
.quality-chip strong{color:var(--navy);font-size:.84rem}
.quality-chip.ok{background:#F2F9EF;border-color:#D7EFCB}
.quality-chip.warn{background:#FFF9E6;border-color:#F5DC8A}

.attention-panel{padding-bottom:14px}
.attention-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.attention-card{border:1px solid var(--line);border-radius:12px;background:#FAFCFD;padding:13px;min-width:0;display:flex;flex-direction:column;gap:4px}
.attention-kicker{font-size:.69rem;font-weight:800;text-transform:uppercase;letter-spacing:.035em;color:#667085}
.attention-card strong{color:var(--navy);font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.attention-card span{font-size:.74rem;color:var(--muted);min-height:18px}
.detail-link{align-self:flex-start;border:0;background:transparent;color:var(--sena-dark);font-weight:800;font-size:.74rem;padding:4px 0;text-decoration:underline;text-underline-offset:2px}
.detail-link:hover{color:var(--navy)}
.table-detail{white-space:nowrap}

.timeline-head{align-items:flex-start}
.segmented{display:inline-flex;gap:2px;padding:3px;background:#E9EEF1;border-radius:10px;flex-wrap:wrap}
.segment{border:0;background:transparent;color:#475467;font-size:.75rem;font-weight:750;padding:7px 10px;border-radius:8px;min-height:32px}
.segment.active{background:#fff;color:var(--navy);box-shadow:0 1px 5px rgba(0,48,77,.1)}

.chart-drill{cursor:pointer;outline:none}
.chart-drill:hover .chart-bar,.chart-drill:focus .chart-bar{fill:var(--sena-dark)}
.chart-drill:focus .chart-label{font-weight:800;fill:var(--navy)}

.sort-btn{width:100%;border:0;background:transparent;padding:0;color:inherit;font:inherit;font-weight:inherit;text-transform:inherit;letter-spacing:inherit;display:inline-flex;align-items:center;gap:5px;justify-content:flex-start;white-space:nowrap}
th.num .sort-btn{justify-content:flex-end}
.sort-btn span{font-size:.65rem;color:#98A2B3}
.sort-btn.active span{color:var(--sena-dark)}
.action-col{width:88px;text-align:center;white-space:nowrap}

.page-actions{display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.page-number{min-width:34px;height:34px;border:1px solid #C7D0D7;border-radius:9px;background:#fff;color:var(--navy);font-weight:750;font-size:.78rem;padding:0 9px}
.page-number:hover{border-color:var(--sena);background:#F2F9EF}
.page-number.active{background:var(--sena);border-color:var(--sena);color:#fff}
.page-ellipsis{display:inline-grid;place-items:center;min-width:24px;height:34px;color:#667085;font-weight:700}

.modal-wide{width:min(1120px,100%)}
.issue-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:10px;max-height:54vh;margin-top:12px}
.issue-table{min-width:900px;font-size:.74rem}
.issue-table th{position:sticky;top:0}
.modal-note{font-size:.75rem;color:var(--muted);margin-top:10px}
.file-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.file-mode-card{border:1px solid #C8D2D9;border-radius:13px;background:#fff;padding:16px;text-align:left;display:flex;flex-direction:column;gap:7px;color:var(--ink)}
.file-mode-card:hover{border-color:var(--sena);background:#F7FCF4;box-shadow:0 6px 18px rgba(0,48,77,.08)}
.file-mode-card strong{color:var(--navy)}
.file-mode-card span{font-size:.79rem;line-height:1.4;color:var(--muted)}

@media(max-width:1280px){.filter-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.attention-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.quality-control-head,.timeline-head{flex-direction:column;align-items:stretch}.quality-actions{justify-content:flex-start}.attention-grid{grid-template-columns:1fr}.file-mode-grid{grid-template-columns:1fr}}