:root{
  --bg:#0d1117; --bg-2:#141b25; --bg-3:#1b2431; --line:#26303d; --line-2:#33405222;
  --tx:#e6edf3; --tx-2:#9aa7b6; --tx-3:#6b7889;
  --acc:#4c9aff; --acc-2:#2f6fd0;
  --ok:#3fb950; --warn:#d29922; --bad:#f85149; --est:#e0803c;
  --r:10px;
}
*{box-sizing:border-box}
/* El atributo hidden lo aplica el navegador con display:none, pero cualquier
   regla display de autor (.overlay y .modal usan grid) le gana. Sin esto, el
   overlay arranca visible y tapa la pantalla entera. */
[hidden]{display:none !important}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--tx);
  font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{margin:0;font-weight:650;letter-spacing:-.01em}
p{margin:0}
em{color:var(--tx);font-style:italic}
.muted{color:var(--tx-2);font-size:13px}
.sub{color:var(--tx-2);font-size:13.5px;margin-top:4px;max-width:78ch}
.r{text-align:right}

/* ── topbar ─────────────────────────────────────────────── */
.topbar{
  display:flex;justify-content:space-between;align-items:center;gap:20px;
  padding:14px 26px;border-bottom:1px solid var(--line);background:var(--bg-2);
  position:sticky;top:0;z-index:20;
}
.brand{display:flex;gap:13px;align-items:center}
.brand-mark{font-size:26px}
.brand-mark-img{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:center 20%;background:#7d8083;border:1.5px solid var(--line)}
.brand h1{font-size:16px}
.brand p{font-size:12.5px;color:var(--tx-3)}
.topbar-right{display:flex;gap:10px;align-items:center}

/* ── landing ────────────────────────────────────────────── */
.landing{
  position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px;
  background:radial-gradient(circle at 50% 42%, #8d9094 0%, #6d7074 78%);
  transition:opacity .45s ease;
}
.landing.gone{opacity:0;pointer-events:none}
.landing-inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.landing-img{
  width:min(300px,58vw);height:auto;
  filter:drop-shadow(0 14px 30px rgba(0,0,0,.35));
  animation:nicanor-in .6s cubic-bezier(.2,.9,.3,1.2) both;
}
@keyframes nicanor-in{from{opacity:0;transform:translateY(14px) scale(.94)}to{opacity:1;transform:none}}
.landing-title{
  font-size:clamp(52px,11vw,88px);font-weight:800;letter-spacing:-.04em;line-height:1;
  color:#17191c;margin-top:4px;text-shadow:0 2px 0 rgba(255,255,255,.18);
}
.landing-tag{font-size:clamp(14px,2.4vw,17px);color:#23262a;font-weight:500;max-width:34ch;margin:2px 0 20px}
.landing-btn{
  font:inherit;font-size:17px;font-weight:700;color:#f3f0ea;background:#17191c;
  border:2px solid #17191c;border-radius:11px;padding:12px 40px;cursor:pointer;
  box-shadow:0 5px 0 rgba(0,0,0,.28);transition:transform .12s, box-shadow .12s;
}
.landing-btn:hover{transform:translateY(-2px);box-shadow:0 7px 0 rgba(0,0,0,.28)}
.landing-btn:active{transform:translateY(2px);box-shadow:0 2px 0 rgba(0,0,0,.28)}

.pill{padding:3px 10px;border-radius:99px;font-size:12px;font-weight:550;white-space:nowrap}
.pill-ok{background:#1c3a24;color:#68d391;border:1px solid #2d5a38}
.pill-bad{background:#3d1d1d;color:#ff8b82;border:1px solid #5c2b2b}
.pill-muted{background:var(--bg-3);color:var(--tx-3);border:1px solid var(--line)}
.pill-est{background:#3d2a17;color:#f0a763;border:1px solid #5c422a}

/* ── botones ────────────────────────────────────────────── */
.btn{
  font:inherit;font-size:13.5px;font-weight:550;padding:8px 15px;border-radius:8px;
  border:1px solid var(--line);background:var(--bg-3);color:var(--tx);cursor:pointer;
  transition:.13s;white-space:nowrap;
}
.btn:hover{border-color:#455266;background:#222d3d}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn-primary{background:var(--acc-2);border-color:var(--acc);color:#fff}
.btn-primary:hover{background:var(--acc);border-color:#6fb0ff}
.btn-ghost{background:transparent}
.btn-refresh{background:#2a2118;border-color:#4a3a26;color:#e8b464}
.btn-refresh:hover{background:#3a2d1f;border-color:#6b5535}
.btn-sm{padding:4px 10px;font-size:12px}

/* ── steps ──────────────────────────────────────────────── */
.steps{display:flex;gap:6px;padding:14px 26px 0;border-bottom:1px solid var(--line);background:var(--bg-2)}
.step{
  font:inherit;font-size:13.5px;font-weight:550;color:var(--tx-3);background:none;border:0;
  border-bottom:2px solid transparent;padding:9px 15px 11px;cursor:pointer;display:flex;
  gap:8px;align-items:center;transition:.13s;
}
.step:hover{color:var(--tx-2)}
.step.active{color:var(--tx);border-bottom-color:var(--acc)}
.step.done .step-n{background:var(--ok);color:#0d1117;border-color:var(--ok)}
.step-n{
  width:20px;height:20px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;font-size:11.5px;background:var(--bg-3);
}
.step.active .step-n{background:var(--acc);border-color:var(--acc);color:#fff}

/* ── layout ─────────────────────────────────────────────── */
main{max-width:1280px;margin:0 auto;padding:24px 26px 80px}
.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:20px}
.panel-head h2{font-size:20px}
.panel-foot{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  margin-top:26px;padding-top:18px;border-top:1px solid var(--line);
}
.panel-foot > div{display:flex;gap:9px}
.actions{display:flex;gap:9px}
.legend{display:flex;gap:12px;align-items:center;font-size:12px;color:var(--tx-3);flex-wrap:wrap}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:-6px}
.dot-public{background:var(--ok)} .dot-partial{background:var(--warn)}
.dot-restricted{background:var(--est)} .dot-none{background:var(--bad)}

/* ── paso 1: países ─────────────────────────────────────── */
.country-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:11px}
.ccard{
  border:1px solid var(--line);border-radius:var(--r);padding:13px 15px;background:var(--bg-2);
  cursor:pointer;transition:.13s;position:relative;text-align:left;font:inherit;color:inherit;
}
.ccard:hover{border-color:#455266;background:var(--bg-3)}
.ccard.sel{border-color:var(--acc);background:#16283f;box-shadow:0 0 0 1px var(--acc) inset}
.ccard.disabled{opacity:.42;cursor:not-allowed}
.ccard.disabled:hover{border-color:var(--line);background:var(--bg-2)}
.ccard-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:7px}
.ccard-name{font-weight:600;font-size:14.5px;display:flex;gap:8px;align-items:center}
.ccard-meta{font-size:11.5px;color:var(--tx-3);line-height:1.45}
.ccard-bar{height:3px;border-radius:3px;background:var(--bg-3);margin:9px 0 7px;overflow:hidden}
.ccard-bar div{height:100%;border-radius:3px}
.ccard-tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.tag{font-size:10.5px;padding:2px 7px;border-radius:5px;background:var(--bg-3);color:var(--tx-3);border:1px solid var(--line)}
.tag-ready{background:#1c3a24;color:#68d391;border-color:#2d5a38}
.tag-prep{background:#2a2a17;color:#c9c264;border-color:#454526}
.tag-est{background:#3d2a17;color:#f0a763;border-color:#5c422a}
.opt-check{display:inline-flex;gap:8px;align-items:center;margin-top:14px;font-size:13px;color:var(--tx-2);cursor:pointer;user-select:none}
.opt-check input{width:15px;height:15px;accent-color:var(--acc);cursor:pointer}

/* ── paso 2: figuras ────────────────────────────────────── */
.preset-row{display:flex;gap:13px;align-items:center;margin-bottom:18px;flex-wrap:wrap}
.label{font-size:13px;color:var(--tx-2);font-weight:550}
.segmented{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.segmented button{
  font:inherit;font-size:12.5px;font-weight:550;padding:6px 13px;background:var(--bg-2);
  color:var(--tx-2);border:0;border-right:1px solid var(--line);cursor:pointer;transition:.12s;
}
.segmented button:last-child{border-right:0}
.segmented button:hover{background:var(--bg-3);color:var(--tx)}
.segmented button.active{background:var(--acc-2);color:#fff}

.figure-list{display:flex;flex-direction:column;gap:9px}
.fig{
  display:grid;grid-template-columns:34px 1fr 200px 150px;gap:15px;align-items:center;
  border:1px solid var(--line);border-radius:var(--r);padding:12px 15px;background:var(--bg-2);transition:.13s;
}
.fig.off{opacity:.4}
.fig:hover{border-color:#455266}
.fig-check{width:17px;height:17px;accent-color:var(--acc);cursor:pointer}
.fig-name{font-weight:600;font-size:14.5px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.fig-role{font-size:12px;color:var(--tx-3);margin-top:2px}
.fig-profile{font-size:12px;color:var(--tx-2);margin-top:5px;max-width:64ch}
.fig-mini{display:flex;height:7px;border-radius:4px;overflow:hidden;margin-top:8px;background:var(--bg-3)}
.fig-mini span{height:100%}
.fig-nums{font-size:11.5px;color:var(--tx-3);text-align:right;line-height:1.6}
.fig-nums b{color:var(--tx-2);font-weight:600}
.fig-weight{display:flex;flex-direction:column;gap:5px;align-items:flex-end}
.fig-weight input[type=range]{width:100%;accent-color:var(--acc)}
.fig-wval{font-size:15px;font-weight:650;font-variant-numeric:tabular-nums}
.fig-patrimonio{color:var(--tx);font-size:16px;font-weight:700}
.fig-nums .muted{font-size:10.5px}

.assets-toggle{
  font:inherit;font-size:11.5px;font-weight:550;color:var(--tx-2);background:none;border:0;
  cursor:pointer;padding:6px 0 0;margin-top:2px;text-align:left;
}
.assets-toggle:hover{color:var(--acc)}
.recat-n{color:var(--acc);font-weight:650}

.fig-assets{grid-column:1/-1;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.fasset{
  display:grid;grid-template-columns:96px 1fr 232px 62px;gap:12px;align-items:center;
  font-size:12px;padding:5px 9px;background:#00000030;border-radius:6px;border:1px solid transparent;
}
.fa-acts{display:flex;gap:2px;justify-content:flex-end;align-items:center}
.fa-direct-btn{
  font:inherit;font-size:12px;line-height:1;background:none;border:1px solid transparent;
  color:var(--tx-3);border-radius:6px;padding:4px 5px;cursor:pointer;transition:.12s;filter:grayscale(.7);opacity:.7;
}
.fa-direct-btn:hover{border-color:#2d4a5a;background:#12242e;filter:none;opacity:1}
.fa-direct-btn.on{filter:none;opacity:1;background:#12242e;border-color:#2d4a5a}
.fa-direct-btn:disabled{opacity:.3;cursor:not-allowed}
.fa-direct{
  display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;
  background:#12242e;border:1px solid #2d4a5a;color:#7fd4f0;border-radius:6px;padding:4px 8px;
  width:100%;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.fasset.is-direct{border-color:#2d4a5a;background:#0e1c2433}
.fa-auto{font-size:8.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:1px 4px;border-radius:4px;background:#1c3a24;color:#68d391;vertical-align:middle}
.fasset-head{
  background:none;padding:2px 9px 4px;font-size:10px;text-transform:uppercase;letter-spacing:.04em;
  color:var(--tx-3);font-weight:600;
}
.fasset-head:hover{background:none}
.fa-unit{text-transform:none;letter-spacing:0;color:var(--tx-3);font-weight:500;font-size:9.5px}
.fasset.changed{border-color:var(--acc);background:#16283f4d}
.fasset.out{opacity:.5}
.fasset.out .fa-label,.fasset.out .fa-amt{text-decoration:line-through}
.fa-amt{font-variant-numeric:tabular-nums;color:var(--tx-2);text-align:right;font-weight:600}
.fa-label{color:var(--tx-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fa-fx{font-size:9px;padding:1px 5px;border-radius:4px;background:#3d2a17;color:#f0a763;text-transform:uppercase;letter-spacing:.03em;vertical-align:middle}
.fa-cat{
  font:inherit;font-size:11.5px;background:var(--bg-3);border:1px solid var(--line);color:var(--tx);
  border-radius:6px;padding:4px 7px;cursor:pointer;width:100%;
}
.fa-cat:focus{outline:0;border-color:var(--acc)}
.fa-cat:disabled{opacity:.5;cursor:not-allowed}
.fasset.changed .fa-cat{border-color:var(--acc);color:#8fc0ff}
.fa-del{
  font:inherit;font-size:12px;line-height:1;background:none;border:1px solid transparent;
  color:var(--tx-3);border-radius:6px;padding:4px 5px;cursor:pointer;transition:.12s;
}
.fa-del:hover{border-color:#5a2d2d;background:#3a1c1c;color:#ff8b82}
.fasset.out .fa-del:hover{border-color:#2d5a38;background:#1c3a24;color:#68d391}
.out-n{color:var(--bad);font-weight:650}

.fliab-head{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--bad);font-weight:600;margin:10px 0 4px}
.fliab{
  display:grid;grid-template-columns:96px 1fr 262px;gap:12px;align-items:center;
  font-size:12px;padding:5px 9px;background:#2a161612;border-radius:6px;border:1px solid #5c2b2b33;
}
.fliab.off{opacity:.5}
.fliab .fa-amt{color:#ff8b82}
.fliab-to{color:var(--tx-2);font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── paso 3: tabla de clases de activo ──────────────────── */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2)}
.tbl-class{width:100%;border-collapse:collapse;font-size:13.5px;min-width:820px}
.tbl-class thead th{
  text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--tx-3);
  font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--bg-3);white-space:nowrap;
}
.tbl-class .c-exp{width:34px} .tbl-class .c-acc{width:74px} .tbl-class .c-liq{width:86px}
.tbl-class .c-cty{width:96px} .tbl-class .c-ins{width:72px} .tbl-class .c-w{width:92px}

.clsrow>td{padding:11px 12px;border-bottom:1px solid var(--line-2);vertical-align:middle}
.clsrow.acc{background:#131d17}
.clsrow.rej{opacity:.52}
.clsrow.rej .cls-name{text-decoration:line-through}
.clsrow:hover>td{background:#18222f}

.exp-btn{
  font:inherit;font-size:14px;background:none;border:0;color:var(--tx-2);cursor:pointer;
  width:24px;height:24px;border-radius:6px;line-height:1;
}
.exp-btn:hover{background:var(--bg-3);color:var(--tx)}

.acc-toggle{display:inline-flex;border:1px solid var(--line);border-radius:7px;overflow:hidden}
.mini{
  font:inherit;font-size:12px;font-weight:650;width:28px;height:26px;background:var(--bg-3);
  color:var(--tx-3);border:0;border-right:1px solid var(--line);cursor:pointer;transition:.12s;
}
.mini:last-child{border-right:0}
.mini:hover{color:var(--tx)}
.mini.on-acc{background:#1c3a24;color:#68d391}
.mini.on-rej{background:#3a1c1c;color:#ff8b82}

.cls-name{font-weight:600;font-size:14px;display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.cls-desc{font-size:11.5px;color:var(--tx-3);margin-top:3px;max-width:52ch;line-height:1.45}
.mini-badge{font-size:9.5px;padding:1px 6px;border-radius:5px;background:#4a2626;color:#ff9d95;font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.why-btn{
  font:inherit;font-size:11px;width:19px;height:19px;line-height:1;border-radius:50%;
  border:1px solid #5a2d2d;background:#3a1c1c;color:#ff9d95;cursor:pointer;padding:0;flex:none;
}
.why-btn:hover{background:#4a2626;border-color:#7a3a3a}
.why-btn.subtle{border-color:var(--line);background:var(--bg-3);color:var(--tx-3)}
.why-btn.subtle:hover{border-color:var(--acc);color:var(--acc)}
.ins-tot{color:var(--tx-3);font-size:11px}

.wcell{display:inline-flex;align-items:center;gap:3px;justify-content:flex-end}
.cw-input{
  width:62px;background:var(--bg-3);border:1px solid var(--line);color:var(--tx);
  border-radius:6px;padding:5px 7px;font:inherit;font-size:12.5px;text-align:right;font-variant-numeric:tabular-nums;
}
.cw-input:focus{outline:0;border-color:var(--acc)}
.cw-input:disabled{opacity:.4}
.cw-input.ovr{border-color:var(--acc);background:#16283f;color:#8fc0ff;font-weight:650}
.wpct{color:var(--tx-3);font-size:11.5px}

/* detalle expandido: activos correlacionados */
.clsdetail>td{padding:0;background:#0e141c;border-bottom:1px solid var(--line)}
.isub{padding:12px 16px 14px 46px;border-bottom:1px solid var(--line-2)}
.isub:last-child{border-bottom:0}
.isub-head{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--tx-3);margin-bottom:8px;font-weight:600}
.inst2-list{display:flex;flex-direction:column;gap:4px}
.inst2{
  display:grid;grid-template-columns:20px 92px 1fr 130px 74px 46px 28px 28px 28px;gap:8px;align-items:center;
  font-size:12.5px;padding:5px 8px;background:#00000030;border-radius:6px;border:1px solid transparent;
}
.inst2:hover{border-color:var(--line)}
.inst2.off{opacity:.42}
.inst2.off .i2-nm,.inst2.off .i2-tk{text-decoration:line-through}
.inst2 input[type=checkbox]{accent-color:var(--acc);cursor:pointer;width:14px;height:14px}
.i2-tk{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:650;font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.i2-nm{color:var(--tx-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.i2-added{font-size:9px;padding:1px 5px;border-radius:4px;background:#16283f;color:#7fb0ff;text-transform:uppercase;letter-spacing:.03em;vertical-align:middle}
.i2-meta{color:var(--tx-3);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.i2-w{
  width:100%;background:var(--bg-3);border:1px solid var(--line);color:var(--tx);
  border-radius:5px;padding:3px 6px;font:inherit;font-size:11.5px;text-align:right;font-variant-numeric:tabular-nums;
}
.i2-w:focus{outline:0;border-color:var(--acc)}
.i2-w:disabled{opacity:.35}
.i2-split{color:var(--tx-3);font-size:11px;font-variant-numeric:tabular-nums;text-align:right}
.i2-btn{
  font:inherit;font-size:12px;text-align:center;text-decoration:none;background:var(--bg-3);
  border:1px solid var(--line);color:var(--tx-2);border-radius:6px;padding:3px 0;cursor:pointer;
  line-height:1.4;transition:.12s;display:inline-block;
}
.i2-btn:hover{border-color:var(--acc);color:var(--tx)}
.i2-btn.dis{opacity:.28;cursor:default;border-style:dashed}
.i2-btn.dis:hover{border-color:var(--line);color:var(--tx-2)}
.i2-btn.del:hover{border-color:#5a2d2d;color:#ff8b82}

/* autocompletado de activos */
.add-row{position:relative;margin-top:9px}
.add-input{
  width:100%;max-width:520px;background:var(--bg);border:1px solid var(--line);color:var(--tx);
  border-radius:7px;padding:7px 11px;font:inherit;font-size:12.5px;
}
.add-input:focus{outline:0;border-color:var(--acc)}
.ac-menu{
  position:absolute;top:calc(100% + 3px);left:0;z-index:30;width:100%;max-width:520px;
  background:var(--bg-3);border:1px solid var(--line);border-radius:8px;box-shadow:0 10px 28px #0009;
  max-height:280px;overflow:auto;padding:4px;
}
.ac-item{
  display:grid;grid-template-columns:96px 1fr auto;gap:9px;align-items:center;width:100%;
  font:inherit;text-align:left;background:none;border:0;color:var(--tx);cursor:pointer;
  padding:7px 9px;border-radius:6px;
}
.ac-item:hover{background:#1c2938}
.ac-tk{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:650;font-size:11.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ac-nm{color:var(--tx-2);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ac-src{font-size:9.5px;padding:2px 7px;border-radius:5px;font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.ac-src.loc{background:#1c3a24;color:#68d391}
.ac-src.yh{background:#3a2f14;color:#e0b34e}
.ac-empty{padding:9px 11px;color:var(--tx-3);font-size:12px}
.direct-current{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;
  padding:9px 12px;background:#12242e;border:1px solid #2d4a5a;border-radius:8px;font-size:12.5px;
}

/* modal de detalle de activo */
.modal-info{max-width:520px}
.info-tk{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:700;color:var(--acc);margin-right:6px}
#infoTitle{font-size:16px}
.info-grid{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin-top:14px;font-size:13px}
.info-k{color:var(--tx-3);white-space:nowrap}
.info-v{color:var(--tx)}
.info-desc{margin-top:14px;font-size:13px;line-height:1.55;color:var(--tx-2);padding:11px 13px;background:#00000038;border-radius:8px;border-left:2px solid var(--line)}
.info-flag{margin-top:14px;font-size:13px;line-height:1.5;color:#ff9d95;padding:11px 13px;background:#2a1616;border:1px solid #5c2b2b;border-radius:8px}
.info-why{margin-top:14px;font-size:12.5px;line-height:1.55;color:var(--tx-2);padding:11px 13px;background:#00000038;border-radius:8px;border-left:2px solid var(--est)}
.info-why-h{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--est);font-weight:650;margin-bottom:5px}

.dropped-meter{display:flex;flex-direction:column;gap:6px;align-items:flex-end;min-width:190px}
.meter{width:190px;height:6px;background:#3a1c1c;border-radius:4px;overflow:hidden}
.meter-fill{height:100%;background:var(--ok);transition:width .25s}

/* ── paso 4 ─────────────────────────────────────────────── */
.metric-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px;margin-bottom:18px}
.metric{border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;background:var(--bg-2)}
.metric-v{font-size:21px;font-weight:680;font-variant-numeric:tabular-nums;line-height:1.2}
.metric-l{font-size:11.5px;color:var(--tx-3);margin-top:3px}
.metric.warn .metric-v{color:var(--warn)}
.metric.bad .metric-v{color:var(--bad)}
.metric.ok .metric-v{color:var(--ok)}

.split{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start}
.split-side h3{font-size:12.5px;color:var(--tx-3);text-transform:uppercase;letter-spacing:.05em;margin:18px 0 9px}
.split-side h3:first-child{margin-top:0}

.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{
  text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--tx-3);
  font-weight:600;padding:8px 10px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);
}
.tbl td{padding:8px 10px;border-bottom:1px solid var(--line-2)}
.tbl tr:hover td{background:var(--bg-2)}
.tbl .tk{font-family:ui-monospace,Menlo,Consolas,monospace;font-weight:650;font-size:12px}
.tbl .nm{color:var(--tx-2);max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tbl .w{font-variant-numeric:tabular-nums;font-weight:650;text-align:right}
.tbl .cls{font-size:11.5px;color:var(--tx-3)}
.tbl input[type=number]{
  width:70px;background:var(--bg-3);border:1px solid var(--line);color:var(--tx);
  border-radius:6px;padding:4px 7px;font:inherit;font-size:12px;text-align:right;
}
.tbl input[type=number]:focus{outline:0;border-color:var(--acc)}
.tbl tr.edited td{background:#16283f66}

.bar-row{display:flex;align-items:center;gap:9px;margin-bottom:7px;font-size:12px}
.bar-lbl{flex:1;color:var(--tx-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-track{width:82px;height:6px;background:var(--bg-3);border-radius:4px;overflow:hidden}
.bar-fill{height:100%;background:var(--acc);border-radius:4px}
.bar-val{font-variant-numeric:tabular-nums;color:var(--tx-3);min-width:42px;text-align:right;font-size:11.5px}

/* ── paso 5: desempeño histórico ────────────────────────── */
.bt-chart{
  border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2);
  padding:8px 10px;margin-bottom:12px;min-height:200px;
}
.bt-svg{width:100%;height:auto;display:block}
.bt-grid{stroke:var(--line);stroke-width:1}
.bt-grid.faint{stroke:var(--line);opacity:.35}
.bt-ytick{fill:var(--tx-3);font-size:10.5px;text-anchor:end;font-variant-numeric:tabular-nums}
.bt-xtick{fill:var(--tx-3);font-size:10.5px;text-anchor:middle}
.bt-area{fill:url(#btgrad);stroke:none}
.bt-line{fill:none;stroke:var(--acc);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.bt-bench{fill:none;stroke:var(--tx-3);stroke-width:1.4;stroke-dasharray:5 4;opacity:.75}
.bt-evline{stroke:var(--est);stroke-width:1.2;stroke-dasharray:3 3;opacity:.65}
.bt-evdot{fill:var(--est);stroke:var(--bg-2);stroke-width:1.5}
.bt-evlabel{fill:var(--est);font-size:10.5px;font-weight:650}

.bt-legend{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin-bottom:12px;font-size:12px;color:var(--tx-2)}
.lg{display:flex;gap:6px;align-items:center}
.lg-line{width:20px;height:3px;border-radius:2px;background:var(--acc);flex:none}
.lg-line.dash{height:2px}
.lg b{font-variant-numeric:tabular-nums;font-weight:650}
.lg b.pos{color:var(--ok)} .lg b.neg{color:var(--bad)}
.lg-mark{width:10px;height:10px;border-radius:50%;background:var(--est);border:1.5px solid var(--bg);flex:none}

.bt-note{border-top:1px solid var(--line);padding-top:12px;line-height:1.5}
.bt-note p{margin-bottom:5px;font-size:12px;color:var(--tx-3)}

/* ── avisos ─────────────────────────────────────────────── */
.warn-box{
  border:1px solid #5c422a;background:#2a1f13;border-radius:var(--r);
  padding:12px 15px;margin-bottom:16px;font-size:13px;line-height:1.55;
}
.warn-box.bad{border-color:#5c2b2b;background:#2a1616}
.warn-box.info{border-color:#2f4a6b;background:#131f2e}
.warn-box b{color:#f0a763}
.warn-box.bad b{color:#ff8b82}
.warn-box.info b{color:#7fb0ff}
.warn-box ul{margin:7px 0 0;padding-left:19px;color:var(--tx-2);font-size:12.5px}
.warn-box li{margin-bottom:3px}

/* ── modal / overlay / toast ────────────────────────────── */
.modal{position:fixed;inset:0;background:#000000b8;display:grid;place-items:center;z-index:50;padding:24px}
.modal-box{
  background:var(--bg-2);border:1px solid var(--line);border-radius:14px;padding:24px;
  max-width:780px;width:100%;max-height:86vh;overflow:auto;
}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.preset-list{display:flex;flex-direction:column;gap:9px;margin-top:18px}
.pcard{
  border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;background:var(--bg-3);
  cursor:pointer;transition:.13s;text-align:left;font:inherit;color:inherit;width:100%;
}
.pcard:hover{border-color:var(--acc);background:#1c2938}
.pcard-top{display:flex;gap:9px;align-items:center;margin-bottom:5px}
.pcard-name{font-weight:620;font-size:14.5px}
.pcard-tag{font-size:12.5px;color:var(--tx-2)}
.pcard-note{font-size:11.5px;color:var(--tx-3);margin-top:7px;line-height:1.5;border-left:2px solid var(--line);padding-left:9px}

.overlay{position:fixed;inset:0;background:#0d1117d9;display:grid;place-items:center;z-index:60}
.overlay-box{text-align:center;display:flex;flex-direction:column;gap:11px;align-items:center;max-width:440px;padding:24px}
.spinner{
  width:34px;height:34px;border:3px solid var(--line);border-top-color:var(--acc);
  border-radius:50%;animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

.toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:70;
  background:var(--bg-3);border:1px solid var(--line);border-radius:9px;padding:11px 19px;
  font-size:13.5px;box-shadow:0 8px 26px #0009;max-width:min(620px,90vw);
}
.toast.ok{border-color:#2d5a38;background:#16281c}
.toast.bad{border-color:#5c2b2b;background:#2a1616}

.empty{text-align:center;padding:56px 24px;color:var(--tx-3)}
.empty h3{font-size:16px;color:var(--tx-2);margin-bottom:7px}

@media(max-width:980px){
  .split{grid-template-columns:1fr}
  .fig{grid-template-columns:30px 1fr;gap:11px}
  .fig-nums,.fig-weight{grid-column:2}
  .fig-weight{align-items:stretch}
  .panel-head{flex-direction:column;gap:14px}
}
