
.ka{--ka-bien:#16a34a;--ka-mal:#dc2626;--ka-z:#8e8e93;display:flex;flex-direction:column;gap:14px;font-variant-numeric:tabular-nums}
html.xo-demo .ka,html[data-tema="negro202"] .ka{--ka-bien:#22c55e;--ka-mal:#f87171;--ka-z:#a1a1a6}
.ka .ka-bien{color:var(--ka-bien)}.ka .ka-mal{color:var(--ka-mal)}.ka .ka-z{color:var(--muted)}
.ka-lbl{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.ka-res{display:grid;grid-template-columns:1.6fr repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--line-2);border-radius:12px;background:var(--surface);overflow:hidden}
.ka-res > div{padding:14px 16px;min-width:0}.ka-res > div + div{border-left:1px solid var(--line-2)}
.ka-res b{display:block;font-size:20px;font-weight:600;letter-spacing:-.01em}.ka-res .ka-big b{font-size:30px}
.ka-res small{display:block;font-size:12px;color:var(--muted);margin-top:2px}.ka-res p{margin:6px 0 0;font-size:12px;color:var(--muted);line-height:1.4}
.ka-card{border:1px solid var(--line-2);border-radius:12px;background:var(--surface);padding:14px 16px;min-width:0;display:flex;flex-direction:column;gap:10px}
.ka-card header h3{margin:0;font-size:14px;font-weight:600}.ka-card header p{margin:2px 0 0;font-size:12px;color:var(--muted)}
.ka-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ka-seg{display:inline-flex;align-self:flex-start;gap:2px;padding:3px;border:1px solid var(--line-2);border-radius:999px;background:var(--surface)}
.ka-seg button{all:unset;cursor:pointer;padding:6px 14px;border-radius:999px;font-size:13px;color:var(--muted)}
.ka-seg button[aria-selected="true"]{background:var(--ink);color:var(--bg);font-weight:600}.ka-seg button:focus-visible{box-shadow:var(--focus-ring,0 0 0 2px currentColor)}
.ka-vacio,.ka-nota{margin:0;font-size:12px;color:var(--muted)}
html.xo-demo .drawer:has(.ka){background:#000;border-left:1px solid #2c2c2e}
html.xo-demo .drawer:has(.ka) .ka-card,html.xo-demo .drawer:has(.ka) .ka-res{background:#0a0a0a;border-color:#2c2c2e}

.ka-ins ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ka-ins li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:8px;align-items:start;padding:8px 10px;border-radius:8px;background:color-mix(in srgb,var(--ink) 4%,transparent);border-left:3px solid var(--ka-z)}
.ka-ins li span{font-size:13px;line-height:1.45;color:var(--muted);text-align:center}
.ka-ins li p{margin:0;font-size:13px;line-height:1.45}.ka-ins li b{font-weight:600}
.ka-ins li.ka-i-bien{border-left-color:var(--ka-bien)}.ka-ins li.ka-i-bien span{color:var(--ka-bien)}
.ka-ins li.ka-i-mal{border-left-color:var(--ka-mal)}.ka-ins li.ka-i-mal span{color:var(--ka-mal)}

.ka-svg{width:100%;height:auto;display:block;overflow:visible}
.ka-grid{stroke:var(--line-2);stroke-width:1;stroke-dasharray:2 4}
.ka-ax{fill:var(--muted);font-size:10px}
.ka-line{fill:none;stroke:var(--ink);stroke-width:2;stroke-linejoin:round}
.ka-area{fill:var(--ink);opacity:.06}
.ka-prev{fill:none;stroke:var(--muted);stroke-width:1.5;stroke-dasharray:5 4}
.ka-meta{stroke:var(--ka-bien);stroke-width:1.5;stroke-dasharray:1 0}.ka-meta-t{fill:var(--ka-bien);font-size:10px;font-weight:600}
.ka-banda{fill:var(--ka-bien);opacity:.12}
.ka-pt{fill:var(--surface);stroke:var(--ink);stroke-width:1.5}.ka-pt.ka-bien{stroke:var(--ka-bien)}.ka-pt.ka-mal{stroke:var(--ka-mal)}
.ka-pt.on{r:5;fill:var(--ink)}.ka-pt.ka-bien.on{fill:var(--ka-bien)}.ka-pt.ka-mal.on{fill:var(--ka-mal)}
.ka-cross{stroke:var(--muted);stroke-width:1}
.ka-hit{fill:transparent;cursor:crosshair}
.ka-ley{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;margin:0;font-size:11.5px;color:var(--muted)}
.ka-ley span{display:inline-block;width:18px;height:0;border-top:2px solid var(--ink);margin-right:5px;vertical-align:middle}
.ka-ley .ka-l2{border-top:2px dashed var(--muted)}.ka-ley .ka-l3{border-top-color:var(--ka-bien)}

.ka-rk,.ka-dv{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:360px;overflow:auto}
.ka-rk li,.ka-dv li{display:grid;grid-template-columns:minmax(90px,34%) minmax(0,1fr) auto;gap:10px;align-items:center;font-size:12.5px;padding:2px 4px;border-radius:6px;cursor:default}
.ka-rk li:hover,.ka-dv li:hover,.ka-tb tbody tr:hover{background:color-mix(in srgb,var(--ink) 7%,transparent)}
.ka-rk-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ka-rk-n em{font-style:normal;color:var(--muted);display:inline-block;min-width:20px}
.ka-rk li b,.ka-dv li b{font-weight:600;white-space:nowrap;text-align:right}
.ka-rk-b,.ka-dv-b{position:relative;height:14px;border-radius:4px;background:color-mix(in srgb,var(--ink) 6%,transparent)}
.ka-rk-bar,.ka-dv-bar{position:absolute;top:0;bottom:0;border-radius:4px;background:var(--ka-z)}
.ka-rk-bar.ka-bien,.ka-dv-bar.ka-bien{background:var(--ka-bien)}.ka-rk-bar.ka-mal,.ka-dv-bar.ka-mal{background:var(--ka-mal)}
.ka-rk-meta{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--ink);z-index:1}
.ka-rk-banda{position:absolute;top:-3px;bottom:-3px;background:var(--ka-bien);opacity:.2;z-index:1}
.ka-dv-0{position:absolute;left:50%;top:-3px;bottom:-3px;width:1px;background:var(--muted)}

.ka-wf{fill:var(--ka-z)}.ka-wf.ka-bien{fill:var(--ka-bien)}.ka-wf.ka-mal{fill:var(--ka-mal)}.ka-wf.ka-tot{fill:var(--ink)}
.ka-wf:hover{opacity:.8}.ka-wf-c{stroke:var(--muted);stroke-width:1;stroke-dasharray:2 2}

.ka-tw{overflow-x:auto}
.ka-tb{width:100%;border-collapse:collapse;font-size:12.5px}
.ka-tb th,.ka-tb td{padding:8px 10px;border-bottom:1px solid var(--line-2);text-align:right;white-space:nowrap}
.ka-tb th:first-child,.ka-tb tbody th,.ka-tb tfoot th{text-align:left}
.ka-tb thead th{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
.ka-tb thead button{all:unset;cursor:pointer}.ka-tb thead button:focus-visible{text-decoration:underline}
.ka-tb tbody th{font-weight:500}.ka-tb tfoot th,.ka-tb tfoot td{font-weight:700;border-top:2px solid var(--ink);border-bottom:0}
.ka-st{font-weight:600}

.ka-tip{position:fixed;z-index:200;pointer-events:none;min-width:180px;max-width:280px;padding:10px 12px;border-radius:10px;background:#0a0a0a;color:#f5f5f4;border:1px solid #3a3a3c;box-shadow:0 10px 30px rgba(0,0,0,.35);font-size:12px;font-variant-numeric:tabular-nums;--ka-bien:#22c55e;--ka-mal:#f87171}
.ka-tip .ka-tt{margin:0 0 6px;font-weight:700;font-size:12.5px}.ka-tip .ka-ts{margin:6px 0 0;color:#a1a1a6;font-size:11px}
.ka-tr{display:flex;justify-content:space-between;gap:14px;padding:2px 0}.ka-tr span{color:#a1a1a6}.ka-tr b{font-weight:600}
.ka-tr.ka-bien b{color:var(--ka-bien)}.ka-tr.ka-mal b{color:var(--ka-mal)}

.xo-k[data-ka],.h-kpi[data-ka]{cursor:pointer}
.xo-k[data-ka]:hover,.h-kpi[data-ka]:hover{outline:1px solid var(--muted);outline-offset:-1px}
.xo-k[data-ka]:focus-visible,.h-kpi[data-ka]:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.xo-sp,.h-kpi .spark{cursor:crosshair}
@media (max-width:820px){ .ka-res{grid-template-columns:repeat(2,minmax(0,1fr))} .ka-res > div:nth-child(3){border-left:0} .ka-res > div:nth-child(n+3){border-top:1px solid var(--line-2)} .ka-2{grid-template-columns:1fr} }
@media print{ .ka-tip{display:none!important} .ka-card,.ka-res{break-inside:avoid} .ka-rk,.ka-dv{max-height:none;overflow:visible} .ka-seg{display:none} }
