*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --lima:#BFE870;--bosque:#1B281B;
  --bg:#0f1a0f;--s1:#182518;--s2:#1e2e1e;--s3:#243224;
  --b1:rgba(191,232,112,0.12);--b2:rgba(191,232,112,0.22);
  --t1:#f0f5e8;--t2:rgba(240,245,232,0.65);--t3:rgba(240,245,232,0.35);
  --ok:#4ade80;--warn:#fbbf24;--bad:#f87171;
  color-scheme:dark
}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:13px;background:var(--bg);color:var(--t1);min-height:100vh}


/* ── Header ── */
.hdr{background:var(--bosque);border-bottom:1px solid var(--b2);padding:0 20px;display:flex;align-items:center;justify-content:space-between;height:54px;position:sticky;top:0;z-index:100}
.logo{background:var(--lima);color:var(--bosque);font-size:12px;font-weight:700;padding:4px 10px;border-radius:5px}
.hdr h1{font-size:13px;font-weight:600;color:#fff}
.hdr p{font-size:11px;color:rgba(255,255,255,.5);margin-top:1px}
.hdr-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.btn{border:none;border-radius:5px;padding:6px 14px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:5px}
.btn:hover{opacity:.85}
.btn-g{background:var(--lima);color:var(--bosque)}
.btn-o{background:rgba(255,255,255,.08);border:1px solid var(--b2);color:rgba(255,255,255,.8)}
.msel{background:rgba(255,255,255,.08);border:1px solid var(--b2);border-radius:5px;padding:5px 10px;font-size:11px;color:#fff;outline:none;cursor:pointer}
.msel option{background:#1e2e1e;color:#f0f5e8}
.mlabel{font-size:10px;color:rgba(255,255,255,.45)}

/* ── Upload / empty state ── */
.upload-wrap{display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 54px)}
.upload-box{background:var(--s2);border:2px dashed var(--b2);border-radius:14px;padding:52px 60px;text-align:center;cursor:pointer;max-width:440px;width:100%;transition:border-color .2s}
.upload-box:hover,.upload-box.drag{border-color:var(--lima);background:rgba(191,232,112,.06)}
.upload-box .ico{font-size:40px;margin-bottom:14px}
.upload-box h2{font-size:17px;font-weight:600;color:#fff;margin-bottom:8px}
.upload-box p{font-size:12px;color:var(--t2);line-height:1.6}
.upload-box small{display:block;font-size:10px;color:var(--t3);margin-top:14px}

/* ── Dashboard ── */
.dash{display:none;padding:18px 20px;max-width:1200px;margin:0 auto}
.sec{font-size:10px;color:var(--t3);text-transform:uppercase;letter-spacing:.8px;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.sec::after{content:'';flex:1;height:1px;background:var(--b1)}

/* KPIs */
.kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}
.kpi{background:var(--s2);border:1px solid var(--b1);border-radius:12px;padding:18px;position:relative;overflow:hidden}
.kpi::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--b2)}
.kpi.ok::before{background:var(--ok)}.kpi.warn::before{background:var(--warn)}.kpi.bad::before{background:var(--bad)}
.kn{font-size:10px;color:var(--t2);font-weight:500;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}
.kv{font-size:36px;font-weight:800;color:#fff;line-height:1;margin-bottom:6px}
.kd{font-size:11px;font-weight:600;margin-bottom:10px;min-height:16px}
.kt{font-size:10px;color:var(--t3);line-height:1.4;border-top:1px solid var(--b1);padding-top:10px}
.ok-c{color:var(--ok)}.warn-c{color:var(--warn)}.bad-c{color:var(--bad)}

/* Comparativa */
.comp-box{background:var(--s2);border:1px solid var(--b1);border-radius:12px;margin-bottom:18px;overflow:hidden}
.ct{width:100%;border-collapse:collapse}
.ct th{font-size:10px;color:var(--t2);text-transform:uppercase;letter-spacing:.5px;padding:10px 16px;text-align:left;border-bottom:1px solid var(--b1);background:var(--s3);font-weight:500}
.ct th:not(:first-child){text-align:right}
.ct td{padding:11px 16px;font-size:13px;border-bottom:1px solid var(--b1);color:var(--t2)}
.ct td.cur{color:#fff;font-weight:700;font-size:15px}
.ct td:not(:first-child){text-align:right}
.ct tr:last-child td{border:none;font-size:11px;font-weight:700}
.rl{font-size:11px;font-weight:500}

/* Charts */
.ch-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:18px}
.ch{background:var(--s2);border:1px solid var(--b1);border-radius:12px;padding:18px}
.ch .ttl{font-size:10px;color:var(--t2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:16px;font-weight:500}
.cw{position:relative;height:190px}

/* Voz del cliente */
.vl{display:flex;flex-direction:column}
.vi{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--b1)}
.vi:last-child{border:none;padding-bottom:0}
.vr{width:22px;height:22px;background:var(--s3);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:var(--t2);flex-shrink:0}
.vr.r1{background:rgba(191,232,112,.18);color:var(--lima)}
.vr.r2{background:rgba(191,232,112,.1);color:rgba(191,232,112,.8)}
.vname{font-size:12px;color:var(--t1);font-weight:500}
.vbadge{background:rgba(191,232,112,.1);border:1px solid var(--b2);border-radius:20px;padding:3px 10px;font-size:11px;font-weight:700;color:var(--lima);white-space:nowrap}

/* ── Informe modal ── */
.rov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:200;overflow-y:auto;backdrop-filter:blur(3px)}
.rpanel{background:#fff;max-width:700px;margin:24px auto;border-radius:12px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.rtop{background:var(--bosque);padding:13px 20px;display:flex;align-items:center;justify-content:space-between}
.rlogo{background:var(--lima);color:var(--bosque);font-size:12px;font-weight:700;padding:4px 10px;border-radius:4px}
.rbody{padding:28px 32px;font-family:Arial,sans-serif;color:var(--bosque)}
.rm{font-size:9pt;color:#888;display:flex;gap:16px;margin-bottom:16px;padding-bottom:10px;border-bottom:2px solid var(--lima);flex-wrap:wrap}
.rs{font-size:9pt;font-weight:700;text-transform:uppercase;letter-spacing:.7px;border-left:3px solid var(--lima);padding-left:8px;margin:16px 0 10px;color:var(--bosque)}
.rkg{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.rk{border:1px solid #e0e0e0;border-radius:7px;padding:10px 12px}
.rn{font-size:7.5pt;color:#999;text-transform:uppercase;letter-spacing:.4px;margin-bottom:4px}
.rv{font-size:20pt;font-weight:700;color:var(--bosque);line-height:1}
.rd{font-size:8.5pt;margin-top:4px;font-weight:600}
.ri{font-size:8pt;color:#aaa;margin-top:2px}
.rct{width:100%;border-collapse:collapse;font-size:9.5pt;margin-bottom:14px}
.rct th{background:var(--bosque);color:var(--lima);padding:5px 8px;font-size:8.5pt}
.rct th:not(:first-child){text-align:right}
.rct td{padding:6px 8px;border-bottom:1px solid #eee;color:#333}
.rct td:not(:first-child){text-align:right;font-weight:600}
.rct .dr td{font-size:9pt;font-weight:700;border:none}
.rcon{background:#f5fce8;border-left:3px solid var(--lima);padding:11px 14px;font-size:10.5pt;line-height:1.7;font-style:italic;color:#333;margin-bottom:14px}
.rvt{width:100%;border-collapse:collapse;font-size:9pt}
.rvt th{background:var(--bosque);color:var(--lima);padding:5px 8px;font-size:8pt}
.rvt th:not(:first-child){text-align:right}
.rvt td{padding:7px 8px;border-bottom:1px solid #eee}
.vc{text-align:right;font-weight:700;font-size:11pt;color:var(--bosque)}
.vp{text-align:right;font-size:9pt;color:#aaa}
.ve{font-style:italic;color:#555;font-size:8.5pt}
.rfooter{margin-top:18px;padding-top:8px;border-top:1px solid #e0e0e0;font-size:7.5pt;color:#bbb;display:flex;justify-content:space-between}

/* ── Filtro servicios ── */
.fdrop{display:none;position:absolute;top:calc(100% + 4px);right:0;background:var(--s1);border:1px solid var(--b2);border-radius:8px;min-width:230px;z-index:999;box-shadow:0 8px 32px rgba(0,0,0,.5);overflow:hidden}
.fdrop.open{display:block}
.fsrch{width:100%;background:var(--s3);border:none;border-bottom:1px solid var(--b1);color:var(--t1);font-size:11px;padding:8px 12px;outline:none}
.fsrch::placeholder{color:var(--t3)}
.fact{display:flex;border-bottom:1px solid var(--b1)}
.fact button{flex:1;background:none;border:none;padding:5px;font-size:10px;cursor:pointer;font-weight:600}
.fact button:first-child{color:var(--ok)}.fact button:last-child{color:var(--bad)}
.flist{max-height:200px;overflow-y:auto;padding:4px 0}
.fitem{display:flex;align-items:center;gap:8px;padding:7px 12px;cursor:pointer;font-size:11px;color:var(--t2)}
.fitem:hover{background:var(--s3)}
.fitem input{accent-color:var(--lima)}

/* ── Misc ── */
#toast{display:none;position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--bosque);border:1px solid var(--b2);color:var(--lima);padding:10px 20px;border-radius:20px;font-size:12px;font-weight:600;z-index:300;box-shadow:0 4px 20px rgba(0,0,0,.5)}
#printArea{display:none}
@media print{
  body>*:not(#printArea){display:none!important}
  #printArea{display:block!important;font-family:Arial,sans-serif;font-size:10pt;color:#1B281B;padding:0}
}
