/* Contrapartida de fondeo — negro + oro (oscuro por defecto) y crema + oro (claro). Archivo / IBM Plex. */
:root, :root[data-theme="dark"] {
  --ground:#09090b; --panel:#131317; --panel-2:#1c1c22; --panel-3:#24242b;
  --ink:#f5f1e8; --ink-soft:#b6b1a6; --ink-faint:#8a857b; --hair:rgba(230,184,78,.18); --hair-2:rgba(230,184,78,.34);
  --gold:#e6b84e; --gold-bright:#f7dc97; --good:#63c48a; --good-bg:rgba(99,196,138,.12); --bad:#e07a6b; --bad-bg:rgba(224,122,107,.12);
  --warn:#e6b84e; --warn-bg:rgba(230,184,78,.12); --glow:rgba(230,184,78,.13);
  --grad-gold:linear-gradient(180deg,#f7dc97 0%,#e6b84e 45%,#b98a26 100%);
  --f-display:'Archivo','Arial Black',system-ui,sans-serif; --f-sans:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif; --f-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
  color-scheme: dark;
}
:root[data-theme="light"] {
  --ground:#f3efe4; --panel:#fbf8f1; --panel-2:#efe9db; --panel-3:#e6dfcd;
  --ink:#221f18; --ink-soft:#6a6456; --ink-faint:#948c7b; --hair:rgba(159,120,40,.22); --hair-2:rgba(159,120,40,.4);
  --gold:#9a7620; --gold-bright:#c1922c; --good:#3c7a52; --good-bg:rgba(60,122,82,.12); --bad:#b0473c; --bad-bg:rgba(176,71,60,.12);
  --warn:#9c6f26; --warn-bg:rgba(156,111,38,.14); --glow:rgba(159,120,40,.10); --grad-gold:linear-gradient(180deg,#c9971f 0%,#9a7620 100%);
  color-scheme: light;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--ground); color:var(--ink); font-family:var(--f-sans); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased; min-height:100vh; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; background:radial-gradient(60% 45% at 50% -10%, var(--glow), transparent 70%); }
.wrap { max-width:1180px; margin:0 auto; padding:clamp(16px,3.5vw,36px); padding-top:max(16px,env(safe-area-inset-top)); position:relative; }
.muted { color:var(--ink-soft); } .faint { color:var(--ink-faint); } .small { font-size:.8rem; } .mono { font-family:var(--f-mono); font-variant-numeric:tabular-nums; }
.gold { color:var(--gold); }
.gold-grad { color:var(--gold); }
@supports ((background-clip:text) or (-webkit-background-clip:text)) { .gold-grad { background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent; } }
.good { color:var(--good); } .bad { color:var(--bad); }
[hidden] { display:none !important; }

/* cabecera y navegación */
.top { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; padding-bottom:14px; }
.eyebrow { font-family:var(--f-mono); font-size:.68rem; letter-spacing:.24em; text-transform:uppercase; color:var(--gold); font-weight:600; }
h1 { font-family:var(--f-display); font-weight:800; letter-spacing:-.02em; line-height:1; font-size:clamp(1.9rem,1.3rem + 2.6vw,3rem); margin:.35rem 0 0; }
h2 { font-family:var(--f-display); font-weight:700; font-size:.78rem; text-transform:uppercase; letter-spacing:.14em; color:var(--gold); margin:0 0 12px; }
.top-der { display:flex; gap:8px; align-items:center; }
.tt { font-family:var(--f-mono); font-size:.76rem; background:var(--panel-2); border:1px solid var(--hair); color:var(--ink-soft); padding:8px 12px; border-radius:9px; cursor:pointer; }
.tt:hover { color:var(--ink); border-color:var(--hair-2); }
.sync { font-family:var(--f-mono); font-size:.7rem; color:var(--ink-faint); }
.sync.err { color:var(--bad); }
.nav { display:flex; gap:4px; background:var(--panel); border:1px solid var(--hair); border-radius:12px; padding:4px; margin:0 0 22px; overflow-x:auto; scrollbar-width:none; position:sticky; top:8px; z-index:5; backdrop-filter:blur(10px); }
.nav a { flex:1; text-align:center; white-space:nowrap; padding:10px 14px; border-radius:9px; color:var(--ink-soft); text-decoration:none; font-weight:600; font-size:.9rem; }
.nav a.on { background:var(--panel-3); color:var(--gold); box-shadow:inset 0 0 0 1px var(--hair-2); }
.pie { margin-top:40px; font-size:.72rem; color:var(--ink-faint); text-align:center; }

/* piezas */
.panel { background:var(--panel); border:1px solid var(--hair); border-radius:16px; padding:18px; box-shadow:0 30px 60px -40px var(--glow); }
.kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin:0 0 18px; }
.kpi { background:var(--panel); border:1px solid var(--hair); border-radius:14px; padding:14px 16px; display:flex; flex-direction:column; gap:4px; min-width:0; }
.kpi .k { font-size:.74rem; color:var(--ink-soft); }
.kpi .v { font-family:var(--f-display); font-weight:800; font-size:clamp(1.3rem,1rem + 1.2vw,1.9rem); letter-spacing:-.01em; font-variant-numeric:tabular-nums; line-height:1.1; }
.kpi .s { font-size:.72rem; color:var(--ink-faint); font-family:var(--f-mono); }
.kpi.destacado { border-color:var(--hair-2); background:linear-gradient(180deg,var(--panel-2),var(--panel)); }
.btn { font:inherit; font-weight:600; border:1px solid var(--hair-2); background:var(--panel-2); color:var(--ink); border-radius:10px; padding:10px 16px; cursor:pointer; }
.btn:hover { border-color:var(--gold); }
.btn.oro { background:var(--grad-gold); color:#18140a; border:0; }
.btn.peligro { color:var(--bad); border-color:var(--bad-bg); }
.btn:disabled { opacity:.4; cursor:default; }
.fila-btns { display:flex; gap:8px; flex-wrap:wrap; }

/* formularios */
.campo { display:flex; flex-direction:column; gap:5px; min-width:0; }
.campo .lbl { font-size:.76rem; color:var(--ink-soft); }
.iw { position:relative; }
.iw input, select.inp, input.inp { width:100%; padding:9px 38px 9px 10px; font-family:var(--f-mono); font-size:.92rem; text-align:right; background:var(--panel-2); border:1px solid var(--hair); border-radius:8px; color:var(--ink); font-variant-numeric:tabular-nums; }
input.inp.txt, select.inp { text-align:left; padding-right:10px; font-family:var(--f-sans); }
.iw .u { position:absolute; right:10px; top:50%; transform:translateY(-50%); font-family:var(--f-mono); font-size:.7rem; color:var(--ink-faint); pointer-events:none; }
input:focus-visible, select:focus-visible, button:focus-visible, a:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
input::placeholder { color:var(--ink-faint); }
.rejilla2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.rejilla3 { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
fieldset { border:0; margin:0 0 20px; padding:0; display:flex; flex-direction:column; gap:10px; }
legend { padding:0 0 4px; font-family:var(--f-display); font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; color:var(--gold); }
.seg { display:flex; gap:4px; background:var(--panel-2); border:1px solid var(--hair); border-radius:10px; padding:4px; }
.seg button { flex:1; border:0; background:transparent; color:var(--ink-soft); cursor:pointer; font-family:var(--f-mono); font-size:.8rem; padding:8px 6px; border-radius:7px; }
.seg button.on { background:var(--panel); color:var(--gold); box-shadow:inset 0 0 0 1px var(--hair-2); }
.nota { font-size:.76rem; color:var(--ink-faint); border-left:2px solid var(--hair-2); padding-left:10px; line-height:1.5; }
details.mas { border:1px solid var(--hair); border-radius:12px; background:var(--panel-2); padding:0 14px; }
details.mas > summary { padding:12px 0; cursor:pointer; list-style:none; font-size:.8rem; color:var(--gold); font-weight:600; }
details.mas > summary::-webkit-details-marker { display:none; }
details.mas > summary::before { content:"▸ "; } details.mas[open] > summary::before { content:"▾ "; }
details.mas[open] { padding-bottom:14px; }

/* calculadora */
.mesa { display:grid; grid-template-columns:minmax(0,340px) minmax(0,1fr); gap:24px; align-items:start; }
.mesa .controles { position:static; }
.tabla { width:100%; border-collapse:collapse; font-size:.86rem; }
.tabla th { text-align:right; font-weight:500; color:var(--ink-faint); font-size:.72rem; padding:8px 6px; border-bottom:1px solid var(--hair); white-space:nowrap; }
.tabla td { text-align:right; padding:8px 6px; border-bottom:1px solid var(--hair); font-family:var(--f-mono); font-variant-numeric:tabular-nums; white-space:nowrap; }
.tabla th:first-child, .tabla td:first-child { text-align:left; font-family:var(--f-sans); }
.tabla tr.sin td { color:var(--ink-faint); }
.tabla tr.hoy td { background:var(--warn-bg); }
.tabla input { width:92px; padding:6px 8px; text-align:right; font-family:var(--f-mono); background:var(--panel-2); border:1px solid var(--hair); border-radius:7px; color:var(--ink); }
.tabla input.real { border-color:var(--gold); color:var(--gold); }
.scroll-x { overflow-x:auto; }
.grafico { width:100%; height:auto; display:block; }
.leyenda { display:flex; gap:16px; flex-wrap:wrap; font-size:.74rem; color:var(--ink-soft); margin:8px 0 0; }
.leyenda i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; }
.stat { background:var(--panel-2); border-radius:10px; padding:10px 12px; display:flex; justify-content:space-between; gap:10px; font-size:.84rem; }
.stat b { font-family:var(--f-mono); font-variant-numeric:tabular-nums; }
.aviso { border-radius:12px; padding:12px 14px; font-size:.84rem; line-height:1.5; }
.aviso.warn { background:var(--warn-bg); color:var(--warn); } .aviso.bad { background:var(--bad-bg); color:var(--bad); } .aviso.good { background:var(--good-bg); color:var(--good); }

/* grupos (Hoy) */
.grupos { display:flex; flex-direction:column; gap:16px; }
.grupo { background:var(--panel); border:1px solid var(--hair); border-radius:18px; overflow:hidden; }
.g-cab { display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center; padding:14px 16px; border-bottom:1px solid var(--hair); background:linear-gradient(180deg,var(--panel-2),var(--panel)); }
.g-cab .nombre { flex:1 1 180px; font-family:var(--f-display); font-weight:700; font-size:1.1rem; background:transparent; border:0; color:var(--ink); padding:4px 0; min-width:0; }
.g-cab .nombre:focus { outline:none; border-bottom:1px solid var(--gold); }
.g-cab label { font-size:.72rem; color:var(--ink-faint); display:flex; gap:6px; align-items:center; }
.g-cab select, .g-cab input.num { background:var(--panel-2); border:1px solid var(--hair); color:var(--ink); border-radius:8px; padding:6px 8px; font-family:var(--f-mono); font-size:.82rem; }
.g-cab input.num { width:58px; text-align:right; }
.ciclo { display:flex; gap:4px; padding:12px 16px 0; }
.ciclo span { flex:1; height:6px; border-radius:99px; background:var(--panel-3); position:relative; }
.ciclo span.hecho { background:var(--gold); opacity:.55; } .ciclo span.hoy { background:var(--grad-gold); box-shadow:0 0 12px var(--glow); }
.ciclo-lbl { display:flex; justify-content:space-between; padding:6px 16px 0; font-size:.68rem; color:var(--ink-faint); font-family:var(--f-mono); }
.g-cuerpo { padding:16px; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:16px; }
.accion { background:var(--panel-2); border-radius:14px; padding:14px; display:flex; flex-direction:column; gap:10px; }
.accion .linea { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:.88rem; }
.accion .linea .lbl { color:var(--ink-soft); }
.accion .grande { font-family:var(--f-display); font-weight:800; font-size:1.9rem; line-height:1; }
.accion input.num { width:84px; text-align:right; padding:7px 8px; background:var(--panel); border:1px solid var(--hair); border-radius:8px; color:var(--ink); font-family:var(--f-mono); }
.tpstop { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.ts { border-radius:14px; padding:12px 14px; }
.ts.tp { background:var(--bad-bg); } .ts.stop { background:var(--good-bg); } .ts.pelo { background:var(--bad-bg); }
.ts .h { font-size:.72rem; color:var(--ink-soft); } .ts .v { font-family:var(--f-display); font-weight:800; font-size:1.45rem; font-variant-numeric:tabular-nums; }
.ts.tp .v, .ts.pelo .v { color:var(--bad); } .ts.stop .v { color:var(--good); } .ts .s { font-size:.72rem; color:var(--ink-faint); font-family:var(--f-mono); }
.mini3 { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.mini3 div { background:var(--panel-2); border-radius:10px; padding:10px; display:flex; flex-direction:column; gap:2px; }
.mini3 .k { font-size:.68rem; color:var(--ink-faint); } .mini3 .v { font-family:var(--f-mono); font-weight:600; font-variant-numeric:tabular-nums; }
.dias { display:flex; flex-wrap:wrap; gap:6px; font-family:var(--f-mono); font-size:.72rem; }
.dias span { background:var(--panel-2); border-radius:7px; padding:4px 7px; color:var(--ink-soft); }
.dias span.est { color:var(--ink-faint); } .dias span.hoy { box-shadow:inset 0 0 0 1px var(--gold); color:var(--gold); }
.g-pie { display:flex; flex-wrap:wrap; gap:8px; padding:0 16px 16px; }
.g-pie .derecha { margin-left:auto; }
.completo { padding:18px 16px; font-size:.95rem; }
.vacio { text-align:center; padding:40px 20px; }

/* empresas */
.empresas { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:14px; }
.empresa .cab { display:flex; gap:8px; align-items:center; margin-bottom:12px; }
.empresa .cab input { flex:1; font-family:var(--f-display); font-weight:700; font-size:1.05rem; background:transparent; border:0; border-bottom:1px solid var(--hair); color:var(--ink); padding:4px 0; }

/* entrada */
.login { max-width:420px; margin:8vh auto 0; }
.login input { width:100%; padding:13px 14px; font-size:1rem; background:var(--panel-2); border:1px solid var(--hair); border-radius:10px; color:var(--ink); margin:8px 0 12px; font-family:var(--f-sans); }
.login .btn { width:100%; padding:13px; }
.error { color:var(--bad); font-size:.84rem; }

@media (max-width: 900px) {
  .mesa { grid-template-columns:1fr; } .mesa .controles { position:static; max-height:none; }
  .g-cuerpo { grid-template-columns:1fr; }
}
@media (max-width: 520px) {
  .rejilla3 { grid-template-columns:1fr 1fr; } .mini3 { grid-template-columns:1fr 1fr; }
  .tpstop { grid-template-columns:1fr; } .top { align-items:flex-start; }
  .nav a { padding:9px 10px; font-size:.84rem; }
}
/* asistente */
.chat-boton { position:fixed; right:18px; bottom:max(18px,env(safe-area-inset-bottom)); z-index:30; background:var(--grad-gold); color:#18140a; border:0; border-radius:99px; padding:13px 20px; font-weight:700; font-family:var(--f-sans); font-size:.95rem; box-shadow:0 12px 32px -10px rgba(230,184,78,.6); cursor:pointer; }
.chat-panel { position:fixed; right:18px; bottom:18px; z-index:30; width:min(420px,calc(100vw - 24px)); height:min(620px,calc(100vh - 36px)); background:var(--panel); border:1px solid var(--hair-2); border-radius:18px; display:flex; flex-direction:column; box-shadow:0 30px 80px -20px rgba(0,0,0,.7); }
.chat-cab { display:flex; gap:10px; align-items:center; padding:12px 14px; border-bottom:1px solid var(--hair); } .chat-cab b { color:var(--gold); } .chat-cab .tt { margin-left:auto; padding:5px 10px; }
.chat-msgs { flex:1; overflow:auto; padding:14px; display:flex; flex-direction:column; gap:10px; }
.chat-vacio { color:var(--ink-soft); font-size:.86rem; line-height:1.6; } .chat-vacio i { color:var(--ink-faint); }
.msg { max-width:88%; padding:10px 12px; border-radius:14px; font-size:.9rem; line-height:1.5; }
.msg.user { align-self:flex-end; background:var(--panel-3); border-bottom-right-radius:4px; }
.msg.assistant { align-self:flex-start; background:var(--panel-2); border:1px solid var(--hair); border-bottom-left-radius:4px; }
.msg.pensando { color:var(--ink-faint); font-style:italic; }
.chat-form { display:flex; gap:8px; padding:10px; border-top:1px solid var(--hair); }
.chat-form textarea { flex:1; resize:none; background:var(--panel-2); border:1px solid var(--hair); border-radius:10px; color:var(--ink); padding:9px 10px; font:inherit; font-size:.9rem; }
.chat-pie { padding:0 10px 10px; } .chat-pie .tt { width:100%; }
@media (max-width:520px) { .chat-panel { right:0; bottom:0; width:100vw; height:100dvh; border-radius:0; } }
.chat-pie { display:flex; gap:6px; flex-wrap:wrap; } .chat-pie .tt { width:auto; flex:1; font-size:.7rem; padding:7px 8px; }
.chat-notas { border-top:1px solid var(--hair); padding:10px; max-height:40%; overflow:auto; display:flex; flex-direction:column; gap:6px; }
.nota-item { display:flex; gap:8px; align-items:flex-start; background:var(--panel-2); border-radius:9px; padding:7px 9px; font-size:.84rem; } .nota-item span { flex:1; } .nota-item .tt { padding:2px 7px; }