/* ── 01-tokens.css ── */
@font-face{ font-family:'Lato'; font-weight:400; font-style:normal; font-display:swap; src:url('/activos/fuentes/Lato-Regular.ttf') format('truetype'); }
@font-face{ font-family:'Lato'; font-weight:700; font-style:normal; font-display:swap; src:url('/activos/fuentes/Lato-Bold.ttf') format('truetype'); }
@font-face{ font-family:'Lato'; font-weight:900; font-style:normal; font-display:swap; src:url('/activos/fuentes/Lato-Black.ttf') format('truetype'); }

:root{
  --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F8F7F5;
  --line:#DFDDD8; --line-strong:#C7C3BB;
  --ink:#000000; --ink-2:#56534D; --ink-3:#8B877F;
  --blue:#002CA7; --coral:#F08084; --teal:#1DB3B1; --yellow:#E0D54B;
  --ok:#0E7F7D;   --ok-bg:#E2F3F2;
  --warn:#7C6F0C; --warn-bg:#F6F2D6;
  --crit:#BE3F45; --crit-bg:#FBE6E6;
  --info:#002CA7; --info-bg:#E2E8F7;
  --mute:#7A766E; --mute-bg:#EFEDE9;
  --s-real:#2B51B5; --s-prev:#C9545A;
  --focus:#002CA7; --blob-op:.20;
  --shadow:0 1px 0 rgba(0,0,0,.03), 0 8px 26px rgba(0,0,0,.05);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B0B0C; --surface:#141416; --surface-2:#1A1A1D;
    --line:#2A2A2E; --line-strong:#3C3C42;
    --ink:#FFFFFF; --ink-2:#B6B2AB; --ink-3:#85817A;
    --ok:#5BD6D3;   --ok-bg:#0E2E2D;
    --warn:#E0D54B; --warn-bg:#2C2810;
    --crit:#F08084; --crit-bg:#341C1D;
    --info:#A9BDF7; --info-bg:#111B3B;
    --mute:#8E8A83; --mute-bg:#232326;
    --s-real:#5B7BE0; --s-prev:#E0696F;
    --focus:#9FE6FD; --blob-op:.30;
    --shadow:0 1px 0 rgba(255,255,255,.03), 0 10px 30px rgba(0,0,0,.5);
  }
}
:root[data-theme="dark"]{
  --bg:#0B0B0C; --surface:#141416; --surface-2:#1A1A1D;
  --line:#2A2A2E; --line-strong:#3C3C42;
  --ink:#FFFFFF; --ink-2:#B6B2AB; --ink-3:#85817A;
  --ok:#5BD6D3;   --ok-bg:#0E2E2D;
  --warn:#E0D54B; --warn-bg:#2C2810;
  --crit:#F08084; --crit-bg:#341C1D;
  --info:#A9BDF7; --info-bg:#111B3B;
  --mute:#8E8A83; --mute-bg:#232326;
  --s-real:#5B7BE0; --s-prev:#E0696F;
  --focus:#9FE6FD; --blob-op:.30;
  --shadow:0 1px 0 rgba(255,255,255,.03), 0 10px 30px rgba(0,0,0,.5);
}

/* ── 02-base.css ── */
*{ box-sizing:border-box; }
body{ margin:0; background:var(--bg); color:var(--ink);
  font-family:'Lato',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:15px; line-height:1.55; -webkit-font-smoothing:antialiased; }
#app{ max-width:1280px; margin:0 auto; padding:0 24px 96px; }

/* ── 03-cabecera.css ── */
.hd{ position:relative; overflow:hidden; border-bottom:1px solid var(--line);
  margin:0 -24px 28px; padding:30px 24px 0; }
.hd-in{ position:relative; z-index:1; max-width:1232px; margin:0 auto; }
.blob{ position:absolute; z-index:0; pointer-events:none; filter:blur(30px);
  opacity:var(--blob-op); border-radius:60% 40% 70% 30% / 40% 60% 30% 70%; }
.blob-1{ background:var(--coral); width:300px; height:230px; top:-110px; right:5%; }
.blob-2{ background:var(--blue); width:210px; height:190px; top:-20px; right:23%; }
.top{ display:flex; align-items:flex-start; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.wordmark{ font-weight:900; font-size:18px; letter-spacing:-.02em; line-height:1; }
.wordmark span{ color:var(--coral); }
.hd h1{ font-size:clamp(28px,4.4vw,40px); font-weight:900; line-height:1.03;
  letter-spacing:-.03em; margin:9px 0 4px; }
.hd .sub{ color:var(--ink-2); font-size:13.5px; margin:0 0 4px; }
.hd-actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding-top:6px; }
.savebar{ display:flex; align-items:center; gap:9px; font-size:13px; color:var(--ink-2); }
.quien{ font-size:13px; font-weight:700; color:var(--ink-2); padding-left:6px; border-left:1px solid var(--line-strong); }
.dot{ width:8px; height:8px; border-radius:50%; background:var(--ok); flex:none; }
.dot.pend{ background:var(--yellow); } .dot.off{ background:var(--ink-3); } .dot.err{ background:var(--coral); }

.months{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; margin-top:20px; }
.mtab{ position:relative; border:none; background:transparent; color:var(--ink-2);
  font-weight:700; font-size:14px; padding:9px 15px 11px; border-bottom:3px solid transparent;
  border-radius:6px 6px 0 0; text-align:left; }
.mtab:hover{ color:var(--ink); background:var(--surface-2); }
.mtab[aria-current="true"]{ color:var(--ink); border-bottom-color:var(--coral); }
.mtab small{ display:block; font-weight:400; font-size:11.5px; color:var(--ink-3); }
.mtab[aria-current="true"] small{ color:var(--ink-2); }
.mtab.year{ border-bottom-color:transparent; }
.mtab.year[aria-current="true"]{ border-bottom-color:var(--blue); }
.mkill{ border:none; background:transparent; color:var(--ink-3); font-size:15px;
  padding:2px 7px; border-radius:50%; margin-left:2px; }
.mkill:hover{ background:var(--crit-bg); color:var(--crit); }
.mkill.arm{ background:var(--crit-bg); color:var(--crit); border-radius:999px;
  font-size:11.5px; font-weight:700; padding:3px 10px; }
.mnew{ margin-left:6px; border:1px dashed var(--line-strong); background:transparent;
  color:var(--ink-2); border-radius:999px; padding:7px 14px; font-weight:700; font-size:12.5px; }
.mnew:hover{ border-style:solid; border-color:var(--blue); color:var(--blue); }

/* ── 04-botones.css ── */
button{ font-family:inherit; font-size:14px; cursor:pointer; }
.btn{ border:none; border-radius:999px; padding:10px 22px; background:var(--blue);
  color:#fff; font-weight:700; transition:opacity .15s; }
.btn:hover{ opacity:.86; } .btn[disabled]{ opacity:.35; cursor:default; }
.btn-ghost{ background:transparent; color:var(--ink-2); border:1px solid var(--line-strong);
  border-radius:999px; padding:8px 15px; font-weight:700; font-size:12.5px; }
.btn-ghost:hover{ border-color:var(--ink-3); color:var(--ink); }
:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; border-radius:3px; }

/* ── 05-kpis.css ── */
.kpis{ display:grid; gap:1px; background:var(--line);
  grid-template-columns:repeat(auto-fit,minmax(212px,1fr));
  border:1px solid var(--line); border-radius:14px; overflow:hidden;
  margin-bottom:38px; box-shadow:var(--shadow); }
.kpi{ background:var(--surface); padding:18px 20px 17px; }
.kpi .lbl{ font-size:11px; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
  color:var(--ink-3); margin-bottom:9px; }
.kpi .val{ font-size:31px; font-weight:900; line-height:1; letter-spacing:-.03em;
  font-variant-numeric:tabular-nums; }
.kpi .note{ font-size:12.5px; color:var(--ink-2); margin-top:7px; }
.kpi .note b{ font-weight:700; }
.crit{ color:var(--crit); } .ok{ color:var(--ok); }
.meter{ height:7px; border-radius:999px; background:var(--line); overflow:hidden; margin-top:11px; display:flex; }
.meter i{ display:block; height:100%; background:var(--s-real); }
.meter i.prev{ background:var(--s-prev); margin-left:2px; }
.meter i:first-child{ border-radius:999px 0 0 999px; }
.meter i:last-child{ border-radius:0 999px 999px 0; }
.meter.solo i{ border-radius:999px; }
.meter.hit i{ background:var(--teal); }

/* ── 06-acordeon.css ── */
/* ---- acordeón de departamento ---- */
.acc{ border:1px solid var(--line); border-radius:14px; background:var(--surface);
  box-shadow:var(--shadow); margin-bottom:16px; overflow:hidden; }
.acc-head{ width:100%; border:none; background:transparent; text-align:left;
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  padding:18px 20px; font-family:inherit; }
.acc-head:hover{ background:var(--surface-2); }
.acc-title{ display:flex; align-items:center; gap:11px; font-size:19px; font-weight:900;
  letter-spacing:-.02em; color:var(--ink); min-width:180px; }
.acc-kpis{ display:flex; align-items:baseline; gap:26px; flex-wrap:wrap; flex:1; }
.akpi{ display:flex; flex-direction:column; gap:2px; }
.akpi b{ font-size:24px; font-weight:900; letter-spacing:-.03em; line-height:1.05;
  font-variant-numeric:tabular-nums; color:var(--ink); }
.akpi b.crit{ color:var(--crit); } .akpi b.ok{ color:var(--ok); }
.akpi b.warnb{ color:var(--warn); }
.akpi span{ font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-3); }
.acc-more{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:700;
  color:var(--ink-2); white-space:nowrap; margin-left:auto; }
.acc-more::after{ content:"▾"; font-size:11px; transition:transform .15s; }
.acc[data-open="true"] .acc-more::after{ transform:rotate(180deg); }
.acc-body{ padding:4px 20px 24px; border-top:1px solid var(--line); }
.acc-links{ display:flex; gap:14px; flex-wrap:wrap; font-size:12.5px; align-items:center;
  padding:14px 0 4px; }
.acc-links a{ color:var(--ink-2); text-decoration:none; border-bottom:1px solid var(--line-strong); }
.acc-links a:hover{ color:var(--blue); border-bottom-color:var(--blue); }

/* fila de grupo de recurrentes */
tr.grp td{ background:var(--surface-2); }
tr.grp:hover td{ background:var(--surface-2); }
.grp-btn{ border:none; background:transparent; font-family:inherit; font-size:13.5px;
  font-weight:700; color:var(--ink); display:flex; align-items:center; gap:9px;
  padding:11px 14px; width:100%; text-align:left; }
.grp-btn:hover{ color:var(--blue); }
.grp-btn .chev{ font-size:10px; color:var(--ink-3); transition:transform .15s; }
.grp-btn[aria-expanded="true"] .chev{ transform:rotate(180deg); }
tr.rec-row td{ background:var(--surface-2); }
tr.rec-row td:first-child{ box-shadow:inset 3px 0 0 var(--line-strong); }

/* ── 07-facturacion.css ── */
/* panel de facturación desde presupuesto */
tr.fact td{ background:var(--info-bg); padding:14px; }
.factbox{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:13px; }
.factbox b{ font-weight:700; }
.pcts{ display:flex; gap:5px; }
.pct-b{ border:1px solid var(--line-strong); background:var(--surface); color:var(--ink-2);
  border-radius:999px; padding:5px 12px; font-size:12px; font-weight:700; }
.pct-b:hover, .pct-b[aria-pressed="true"]{ border-color:var(--blue); color:var(--blue); }
.factbox input[type="number"]{ width:120px; border:1px solid var(--line-strong);
  background:var(--surface); }
.factbox input[type="text"]{ min-width:200px; flex:1; border:1px solid var(--line-strong);
  background:var(--surface); }

/* ── 08-secciones.css ── */
.sec{ margin-bottom:44px; }
.sec-hd{ display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  flex-wrap:wrap; margin-bottom:13px; }
.sec-hd h2{ font-size:21px; font-weight:900; letter-spacing:-.02em; margin:0;
  display:flex; align-items:center; gap:11px; }
.rule{ width:26px; height:5px; border-radius:3px; flex:none; }
.rule-a{ background:var(--coral); } .rule-b{ background:var(--blue); }
.rule-c{ background:var(--teal); } .rule-d{ background:var(--yellow); }
.links{ display:flex; gap:14px; flex-wrap:wrap; font-size:12.5px; align-items:center; }
.links a{ color:var(--ink-2); text-decoration:none; border-bottom:1px solid var(--line-strong); }
.links a:hover{ color:var(--blue); border-bottom-color:var(--blue); }
.sub-h{ font-size:11px; font-weight:700; letter-spacing:.11em; text-transform:uppercase;
  color:var(--ink-3); margin:26px 0 9px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.sub-h .rt{ margin-left:auto; font-weight:400; letter-spacing:0; text-transform:none;
  font-size:12.5px; color:var(--ink-2); }

/* ── 09-tablas.css ── */
.tw{ overflow-x:auto; border:1px solid var(--line); border-radius:14px;
  background:var(--surface); box-shadow:var(--shadow); }
table{ width:100%; border-collapse:collapse; min-width:740px; }
thead th{ text-align:left; font-size:11px; font-weight:700; letter-spacing:.09em;
  text-transform:uppercase; color:var(--ink-3); padding:12px 14px;
  border-bottom:1px solid var(--line); background:var(--surface-2); white-space:nowrap; }
thead th.r{ text-align:right; }
tbody td{ padding:0; border-bottom:1px solid var(--line); vertical-align:middle; font-size:14px; }
tbody tr:last-child td{ border-bottom:none; }
tbody tr:hover td{ background:var(--surface-2); }
tbody td.r, tfoot td.r{ text-align:right; }
tfoot td{ padding:11px 14px; font-weight:900; font-variant-numeric:tabular-nums;
  border-top:1px solid var(--line-strong); background:var(--surface-2); font-size:13.5px; }
tfoot td.soft{ font-weight:700; color:var(--ink-2); }
.cell{ padding:10px 14px; min-height:42px; display:flex; align-items:center; }
.cell[contenteditable]:empty::before{ content:attr(data-ph); color:var(--ink-3); font-style:italic; }
.cell[contenteditable]:focus{ outline:2px solid var(--focus); outline-offset:-2px; background:var(--bg); }
td.num .cell{ justify-content:flex-end; }
td.num input{ text-align:right; }
input[type="number"],input[type="url"],input[type="text"],input[type="month"]{
  font-family:inherit; font-size:14px; color:var(--ink); background:transparent;
  border:1px solid transparent; border-radius:6px; padding:6px 8px;
  font-variant-numeric:tabular-nums; width:100%; }
input:hover{ border-color:var(--line); }
input:focus{ outline:2px solid var(--focus); outline-offset:-1px; }
select.plain{ font-family:inherit; font-size:13.5px; color:var(--ink); background:transparent;
  border:1px solid var(--line); border-radius:8px; padding:6px 10px; margin:6px 14px; }

.pill{ display:inline-flex; border-radius:999px; margin:7px 14px; font-size:12.5px; font-weight:700; }
.pill select{ font-family:inherit; font-size:12.5px; font-weight:700; border:none;
  border-radius:999px; padding:5px 12px; appearance:none; cursor:pointer;
  color:inherit; background:transparent; }
.tag{ display:inline-flex; align-items:center; border-radius:999px; padding:3px 9px;
  font-size:11px; font-weight:700; letter-spacing:.04em; margin:0 14px; }
.t-ok{ background:var(--ok-bg); color:var(--ok); }
.t-warn{ background:var(--warn-bg); color:var(--warn); }
.t-crit{ background:var(--crit-bg); color:var(--crit); }
.t-info{ background:var(--info-bg); color:var(--info); }
.t-mute{ background:var(--mute-bg); color:var(--mute); }
.lnk{ display:inline-flex; align-items:center; margin:0 14px; color:var(--ink-3); }
.lnk a{ color:var(--blue); text-decoration:none; font-weight:700; font-size:12.5px; }
.lnk a:hover{ text-decoration:underline; }
.mini{ border:1px solid var(--line-strong); background:transparent; color:var(--ink-2);
  border-radius:999px; padding:4px 11px; font-size:11.5px; font-weight:700; margin:5px 6px; white-space:nowrap; }
.mini:hover{ border-color:var(--blue); color:var(--blue); }
.del{ border:none; background:transparent; color:var(--ink-3); font-size:18px; line-height:1;
  width:32px; height:32px; border-radius:50%; margin:5px 8px; }
.del:hover{ background:var(--crit-bg); color:var(--crit); }
td.act{ width:50px; }
.sec-ft{ display:flex; gap:10px; align-items:center; margin-top:11px; flex-wrap:wrap; }
.add{ border:1px dashed var(--line-strong); background:transparent; color:var(--ink-2);
  border-radius:999px; padding:7px 16px; font-weight:700; font-size:12.5px; }
.add:hover{ border-color:var(--blue); color:var(--blue); border-style:solid; }
.empty{ padding:22px 16px; text-align:center; color:var(--ink-3); font-style:italic; font-size:14px; }

/* ── 10-formularios.css ── */
.grid{ display:grid; gap:1px; background:var(--line); border:1px solid var(--line);
  border-radius:14px; overflow:hidden; box-shadow:var(--shadow);
  grid-template-columns:repeat(auto-fit,minmax(178px,1fr)); }
.fld{ background:var(--surface); padding:15px 18px 14px; }
.fld label,.fld .cap{ display:block; font-size:11px; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--ink-3); margin-bottom:5px; }
.fld input{ font-size:25px; font-weight:900; letter-spacing:-.02em; padding:2px 4px;
  margin-left:-4px; width:100%; }
.fld .big{ font-size:25px; font-weight:900; letter-spacing:-.02em;
  font-variant-numeric:tabular-nums; line-height:1.15; }
.fld .hint{ font-size:12px; color:var(--ink-2); margin-top:4px; min-height:18px; }
.fld.wide{ grid-column:1/-1; }
.fld.wide input{ font-size:15px; font-weight:400; letter-spacing:0; }

/* ── 11-graficos.css ── */
.chartbox{ border:1px solid var(--line); border-radius:14px; background:var(--surface);
  box-shadow:var(--shadow); padding:20px 22px 14px; margin-bottom:20px; }
.chart-t{ font-size:13.5px; font-weight:700; margin:0 0 2px; }
.chart-s{ font-size:12.5px; color:var(--ink-2); margin:0 0 12px; }
.legend{ display:flex; gap:18px; flex-wrap:wrap; margin:0 0 14px; font-size:12.5px; color:var(--ink-2); }
.legend span{ display:inline-flex; align-items:center; gap:7px; }
.swatch{ width:11px; height:11px; border-radius:3px; flex:none; }
svg .bar rect{ transition:opacity .15s; }
svg .bar:hover rect{ opacity:.78; }
.axis{ fill:var(--ink-3); font-size:11px; font-weight:700; }
.vlab{ fill:var(--ink-2); font-size:11px; font-weight:700; font-variant-numeric:tabular-nums; }
.goal{ stroke:var(--ink-3); stroke-width:1.5; stroke-dasharray:5 4; }
.goal-t{ fill:var(--ink-3); font-size:10.5px; font-weight:700; letter-spacing:.06em; }

/* ── 12-avisos.css ── */
.notice{ display:flex; gap:12px; align-items:center; flex-wrap:wrap;
  border:1px solid var(--line); border-left:4px solid var(--yellow);
  background:var(--surface-2); border-radius:10px; padding:11px 16px;
  font-size:13px; color:var(--ink-2); margin-bottom:24px; }
.notice b{ color:var(--ink); font-weight:700; }
.notice.ro{ border-left-color:var(--coral); }

details.data{ border:1px solid var(--line); border-radius:12px; background:var(--surface);
  padding:0; margin-bottom:34px; }
details.data summary{ cursor:pointer; padding:12px 18px; font-weight:700; font-size:13.5px;
  color:var(--ink-2); list-style:none; display:flex; align-items:center; gap:10px; }
details.data summary::-webkit-details-marker{ display:none; }
details.data summary::before{ content:"▸"; color:var(--ink-3); }
details.data[open] summary::before{ content:"▾"; }
.data-body{ padding:4px 18px 18px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.data-body p{ width:100%; margin:0 0 4px; font-size:12.5px; color:var(--ink-2); }
textarea{ width:100%; min-height:120px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px; border:1px solid var(--line); border-radius:8px; padding:10px;
  background:var(--surface-2); color:var(--ink); resize:vertical; }

footer{ border-top:1px solid var(--line); margin-top:24px; padding-top:18px;
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-size:12.5px; color:var(--ink-3); }
footer b{ color:var(--ink-2); font-weight:700; }

/* ── 13-responsive.css ── */
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; animation:none !important; } }
@media (max-width:640px){
  #app{ padding:0 16px 72px; }
  .hd{ margin:0 -16px 24px; padding:22px 16px 0; }
  .kpi .val{ font-size:26px; }
}