:root{
  --bg:#f4ecdd; --surface:#fffdf8; --ink:#171310; --ink-dim:#6d6255; --line:#ded0b4;
  --accent:#a8562f; --accent-ink:#7a3d1f; --good:#4f5e3f; --bad:#a23b2a; --soft:#efe4cd;
  --c1:#a8562f; --c2:#d98653; --c3:#c9b18a; --c4:#5b6a4a; --c5:#b9b09f;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#17130f; --surface:#201a14; --ink:#f4ecdd; --ink-dim:#b6a98f; --line:#3a3021;
    --accent:#d98653; --accent-ink:#f1c6a3; --good:#93a87c; --bad:#e08a78; --soft:#2a2214;
    --c1:#d98653; --c2:#a8562f; --c3:#8a7a5c; --c4:#93a87c; --c5:#6d6255;
    color-scheme: dark;
  }
}
*{ box-sizing:border-box; }
html,body{ margin:0; }
body{ background:var(--bg); color:var(--ink); font:15px/1.5 'Syne',-apple-system,sans-serif; }
[hidden]{ display:none !important; }
h1,h2,h3{ font-family:'Cormorant Garamond',serif; margin:0 0 8px; line-height:1.15; }
h1{ font-size:clamp(30px,5vw,42px); font-weight:700; }
h2{ font-size:24px; } h3{ font-size:19px; margin-top:18px; }
.eyebrow{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent-ink); font-weight:600; margin:0 0 4px; }
.lead{ max-width:70ch; margin:0 0 16px; }
.lead strong{ color:var(--accent-ink); }
.fine,.note{ font-size:12px; color:var(--ink-dim); margin:10px 0 0; max-width:80ch; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
a{ color:var(--accent-ink); }
label{ display:block; font-weight:600; font-size:13px; margin:14px 0 6px; }
input,select,textarea{ width:100%; font:inherit; color:var(--ink); background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:11px 14px; min-height:46px; }
textarea{ resize:vertical; }
input:focus,select:focus,textarea:focus{ outline:2px solid var(--accent); outline-offset:1px; }
.btn{ display:inline-block; margin-top:16px; min-height:48px; padding:0 26px; border:0; border-radius:999px; background:var(--ink); color:var(--bg); font:inherit; font-weight:600; cursor:pointer; }
.btn:disabled{ opacity:.45; cursor:not-allowed; }
.btn-ghost{ min-height:44px; padding:0 18px; border:1px solid currentColor; border-radius:999px; background:transparent; color:inherit; font:inherit; cursor:pointer; }
.link{ background:none; border:0; padding:0; margin-top:12px; font:inherit; color:var(--accent-ink); text-decoration:underline; cursor:pointer; display:inline-block; }
.msg{ min-height:1.4em; margin:12px 0 0; font-size:14px; }
.msg.err{ color:var(--bad); } .msg.ok{ color:var(--good); }

/* Ingreso */
.login{ min-height:100vh; display:grid; place-items:center; padding:24px 16px; }
.login-card{ width:100%; max-width:440px; background:var(--surface); border:1px solid var(--line); border-radius:20px; padding:36px 32px; }
.login-card h1{ font-size:40px; margin-bottom:14px; }

/* Portal */
.top{ background:#171310; color:#f4ecdd; }
.top-in{ max-width:1180px; margin:0 auto; padding:14px 16px; display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; }
.brand{ font-family:'Cormorant Garamond',serif; font-size:26px; flex-grow:1; }
.brand span{ font-family:'Syne',sans-serif; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:#d9cbb0; margin-left:10px; }
nav{ display:flex; flex-wrap:wrap; gap:4px; }
nav a{ color:#f4ecdd; text-decoration:none; padding:10px 14px; border-radius:999px; font-size:14px; }
nav a.on{ background:#f4ecdd; color:#171310; font-weight:600; }
.wrap{ max-width:1180px; margin:0 auto; padding:32px 16px 48px; }
.page > * + *{ margin-top:16px; }
.card{ background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:22px; }
.card.soft{ background:var(--soft); border-color:transparent; }
.card.flush{ padding:0; overflow:hidden; }
.grid2{ display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:16px; }
.grid2.wide{ grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); align-items:start; }
.foot{ font-size:12px; color:var(--ink-dim); padding-top:0; }

/* Mi inversión */
.inv{ background:#171310; color:#f4ecdd; border-radius:20px; padding:28px; margin-top:16px; }
.inv h2{ color:#f4ecdd; }
.inv-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:20px; margin-top:10px; }
.inv .k{ font-size:12px; color:#d9cbb0; margin:0; }
.inv .v{ font-family:'Cormorant Garamond',serif; font-size:32px; margin:2px 0 0; line-height:1.1; }
.inv .s{ font-size:12px; color:#d9cbb0; margin:2px 0 0; }

/* Listas y tablas */
.list{ list-style:none; margin:0; padding:0; }
.list li{ display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); }
.list li:last-child{ border-bottom:0; }
.list .d{ font-size:13px; color:var(--ink-dim); white-space:nowrap; }
.overflow{ overflow-x:auto; }
table{ width:100%; border-collapse:collapse; font-size:14px; }
th,td{ text-align:left; padding:13px 16px; border-bottom:1px solid var(--line); vertical-align:middle; }
thead th{ background:#171310; color:#f4ecdd; font-weight:500; font-size:12px; letter-spacing:.04em; }
td.r{ text-align:right; }
.tag{ display:inline-block; font-size:12px; background:var(--soft); border-radius:999px; padding:3px 10px; white-space:nowrap; }
.toolbar{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.toolbar input{ flex:1 1 220px; width:auto; border-radius:999px; }
.pills{ display:flex; flex-wrap:wrap; gap:4px; background:var(--soft); border-radius:999px; padding:4px; }
.pills button{ border:0; background:transparent; color:var(--ink); font:inherit; font-size:14px; min-height:40px; padding:0 14px; border-radius:999px; cursor:pointer; }
.pills button[aria-pressed="true"]{ background:var(--ink); color:var(--bg); }
.dl{ display:inline-block; min-height:40px; line-height:40px; padding:0 16px; border:1px solid var(--ink); border-radius:999px; background:transparent; color:var(--ink); font:inherit; font-size:14px; cursor:pointer; white-space:nowrap; }
.sol{ background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:14px 18px; margin-bottom:10px; }
.sol .h{ display:flex; justify-content:space-between; gap:10px; font-weight:600; }
.sol .m{ font-size:13px; color:var(--ink-dim); }
.badge{ font-size:12px; border-radius:999px; padding:3px 10px; white-space:nowrap; }
.badge.recibida{ background:#f2dccb; color:#7a3e28; } .badge.en_revision{ background:#efe0b8; color:#6a5214; } .badge.resuelta{ background:#dde5d3; color:#33402a; }

/* Pulso */
.kpi-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:6px; overflow:hidden; }
@media (max-width:720px){ .kpi-grid{ grid-template-columns:repeat(2,1fr); } }
.kpi{ background:var(--surface); padding:16px 14px; }
.kpi .label{ font-size:11px; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.08em; font-weight:600; margin-bottom:8px; }
.kpi .value{ font-family:'JetBrains Mono',monospace; font-size:clamp(19px,3vw,25px); font-weight:600; }
.kpi .delta{ font-family:'JetBrains Mono',monospace; font-size:12px; margin-top:5px; color:var(--ink-dim); }
.kpi .delta.up{ color:var(--good); } .kpi .delta.down{ color:var(--bad); }
.kpi .sub{ font-size:11.5px; color:var(--ink-dim); margin-top:3px; }
.bar-row{ display:flex; align-items:center; gap:10px; margin-bottom:9px; }
.bar-row .lbl{ width:56px; flex-shrink:0; color:var(--ink-dim); font-family:'JetBrains Mono',monospace; font-size:11.5px; }
.bar-row .track{ flex:1; background:var(--line); border-radius:3px; height:18px; overflow:hidden; }
.bar-row .fill{ height:100%; background:var(--accent); border-radius:3px; }
.bar-row .val{ width:240px; text-align:right; font-family:'JetBrains Mono',monospace; font-size:11.5px; flex-shrink:0; }
.bar-row .val small{ color:var(--ink-dim); display:block; font-size:10.5px; }
.div-track{ flex:1; position:relative; height:18px; background:var(--line); border-radius:3px; }
.div-track .mid{ position:absolute; left:50%; top:-3px; bottom:-3px; width:2px; background:var(--ink-dim); }
.div-track .neg{ position:absolute; right:50%; top:0; bottom:0; background:var(--bad); }
.div-track .pos{ position:absolute; left:50%; top:0; bottom:0; background:var(--good); }
@media (max-width:720px){ .bar-row .val{ width:118px; font-size:10.5px; } }
.stack{ display:flex; height:30px; border-radius:4px; overflow:hidden; border:1px solid var(--line); }
.stack div{ display:flex; align-items:center; justify-content:center; color:#fff; font-family:'JetBrains Mono',monospace; font-size:11.5px; font-weight:600; }
.legend{ display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:10px; font-size:12px; color:var(--ink-dim); }
.legend i{ display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:6px; vertical-align:-1px; }
.vz-row{ display:grid; grid-template-columns:150px 1fr 140px; align-items:center; gap:10px; min-height:40px; border-bottom:1px solid var(--line); }
.vz-row:last-child{ border-bottom:0; }
.vz-name{ font-size:13px; line-height:1.25; } .vz-name small{ display:block; color:var(--ink-dim); font-size:10.5px; }
.vz-track{ position:relative; height:38px; }
.vz-band{ position:absolute; top:0; bottom:0; background:var(--soft); }
.vz-dot{ position:absolute; top:50%; width:14px; height:14px; margin:-7px 0 0 -7px; border-radius:50%; background:var(--ink-dim); }
.vz-dot.we{ background:var(--surface); border:2px solid var(--ink-dim); }
.vz-dot.boh{ background:var(--accent); } .vz-dot.we.boh{ background:var(--surface); border-color:var(--accent); }
.vz-dot.sm{ width:8px; height:8px; margin:-4px 0 0 -4px; }
.vz-val{ font-family:'JetBrains Mono',monospace; font-size:11.5px; text-align:right; } .vz-val small{ display:block; color:var(--ink-dim); font-size:10.5px; }
@media (max-width:720px){ .vz-row{ grid-template-columns:96px 1fr 84px; gap:6px; } .vz-name{ font-size:12px; } .vz-val{ font-size:10.5px; } }
.pulso section{ margin-bottom:30px; }

/* Modal */
.modal{ position:fixed; inset:0; background:rgba(0,0,0,.55); display:grid; place-items:center; padding:16px; z-index:10; }
.modal-card{ max-width:560px; background:var(--surface); border-radius:18px; padding:28px; }
.check{ display:flex; gap:10px; align-items:flex-start; font-weight:500; }
.check input{ width:20px; min-height:20px; margin-top:2px; }
