/* Statera · Laboratorio (Claude, 28/09/2026) · sobre tokens-v2 + marco + lab-comun */
.lab .mk-rail .fld { display: grid; gap: 4px; margin-top: 6px; font-size: var(--fs-cap); color: var(--text-2); }
.lab .mk-rail .fld > span { font-weight: 600; }
.lab .mk-rail .two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 8px; }
.lab .mk-rail .row-btns { display: flex; gap: 8px; margin-top: 8px; }
.lab .mk-rail .row-btns .btn { flex: 1 1 0; padding: 0 8px; }
.lab .mk-rail .seg.sm { margin-top: 6px; }
.lab .mk-rail .seg.sm button { min-height: 32px; font-size: var(--fs-cap); }
.lab .mk-rail .help { margin-top: 6px; }
.lab .mk-rail .mas { margin-top: 8px; }
.lab .mk-rail .mas[open] summary { margin-bottom: 2px; }
.btn.file { cursor: pointer; }
.apus { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.apu { min-height: 32px; padding: 0 4px; border: 1px solid var(--line-hover); border-radius: 8px; background: var(--bg); color: var(--text-2); font-size: var(--fs-cap); font-weight: 600; cursor: pointer; white-space: nowrap; }
.apu:hover { color: var(--text); border-color: var(--border-strong); }
.apu[aria-checked="true"] { background: var(--ink); color: var(--ink-text); border-color: var(--ink); }
.apu.r::before, .apu.b::before { content: ""; display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 5px; vertical-align: -1px; background: var(--chip-red); }
.apu.b::before { background: var(--chip-black); box-shadow: inset 0 0 0 1px var(--chip-black-border); }
.pano { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 2px; margin-top: 8px; }
.pano > .pn { height: auto; }
.pgrid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1px; }
.pn { min-width: 0; height: 26px; padding: 0; border: 0; border-radius: 4px; font: 700 13px/1 var(--font); letter-spacing: -.04em; color: #fff; cursor: pointer; opacity: .55; }
.pn.r { background: var(--chip-red); } .pn.b { background: var(--chip-black); box-shadow: inset 0 0 0 1px var(--chip-black-border); } .pn.z { background: var(--chip-green); }
.pn.on { opacity: 1; box-shadow: 0 0 0 2px var(--card), 0 0 0 3px var(--text); }
.pn:hover { opacity: .85; }

.lab-src { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: baseline; margin: -4px 0 12px; font-size: var(--fs-sec); }
.lab-src .what { font-weight: 600; }
.lab-src .rule { color: var(--text-2); }
.lab-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 12px; }
@media (min-width: 1500px) { .lab-kpis { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
.kpi .v.sm { font-size: 16px; line-height: 1.35; white-space: normal; }
.lab-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.l-jug { grid-column: 1 / -1; }
.cv-sel { min-width: 260px; }
.seg.sm button { min-height: 30px; font-size: var(--fs-cap); }
.leg + .chart, .leg + .leg { margin-top: 6px; }
.ph + .leg { margin-top: -2px; }
.fan-txt { margin-top: 8px; font-size: var(--fs-sec); line-height: 1.4; }
.fan-wait { display: grid; gap: 8px; }
.tbl.otras td, .tbl.otras th { padding: 5px 6px; }
.tbl.otras tr.no td { color: var(--text-2); }
.lnk { border: 0; background: none; padding: 0; color: var(--text); font-weight: 600; cursor: pointer; text-align: left; }
.lnk:hover { text-decoration: underline; }
.bar-c { width: 22%; }
.pm { position: relative; display: block; height: 8px; }
.pm::before { content: ""; position: absolute; left: 50%; top: -3px; bottom: -3px; width: 1px; background: var(--axis); }
.pm i { position: absolute; top: 0; bottom: 0; border-radius: 2px; }
.pm i.p { background: var(--gain-bar); } .pm i.n { background: var(--loss-bar); }
.tbl.jug td { padding: 3px 8px; }
.tbl.jug tr.mira td { color: var(--text-2); }
@media (max-width: 1279px) { .lab-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
  .lab-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cv-sel { min-width: 0; width: 100%; }
  .seg.sm button { min-height: 44px; }
  .ph .tools { width: 100%; margin-left: 0; }
  .tbl.otras .bar-c, .tbl.otras th:nth-child(5), .tbl.otras td:nth-child(5) { display: none; }
  .tbl.otras td, .tbl.otras th { white-space: normal; padding: 4px 4px; }
  .tbl.otras td:last-child { font-size: var(--fs-cap); }
  .apus { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .apu, .pn { min-height: 44px; }
  .lnk { display: flex; align-items: center; min-height: 44px; min-width: 44px; }
  .pano { grid-template-columns: minmax(0, 1fr); }
  .pano > .pn { height: 44px; }
  .pgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; }
  .pgrid .pn { order: var(--o); height: 44px; font-size: 15px; }
}

.leg[hidden] { display: none; }
.jug-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 28px; }
@media (max-width: 1023px) { .jug-cols { grid-template-columns: minmax(0, 1fr); } .jug-cols .tbl + .tbl thead { display: none; } }
.tbl.otras td { white-space: nowrap; }
.tbl.otras td:first-child { white-space: normal; }
.tbl.otras { font-size: var(--fs-cap); }
.tbl.otras .lnk { font-size: var(--fs-sec); }

/* ---------- v2 (críticos) ---------- */
.lab-cambiar { display: none; }
.lab-kpis { grid-template-columns: minmax(0, 1.45fr) repeat(7, minmax(0, 1fr)); gap: 6px; }
.lab-kpis .kpi { padding: 7px 10px 8px; }
.lab-kpis .kpi .k { white-space: normal; line-height: 1.25; }
.lab-kpis .kpi .v { font-size: 18px; margin-top: 2px; }
.lab-kpis .kpi.hero .v { font-size: 26px; }
.lab-kpis .kpi .d { white-space: normal; }
.fin-pill { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 999px; font-size: var(--fs-cap); font-weight: 700; border: 1px solid var(--line-hover); color: var(--text); letter-spacing: 0; }
.fin-pill.q { border-color: var(--dd); color: var(--text); background: var(--dd-wash); }
.fin-pill.q::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--dd); margin-right: 6px; }
.fin-pill.ok { border-color: var(--border-strong); }
.fan-wait { position: relative; display: grid; gap: 8px; }
.fan-wait svg { display: block; width: 100%; height: 200px; }
.fan-bar { display: block; height: 6px; border-radius: 3px; background: var(--track); overflow: hidden; }
.fan-bar i { display: block; height: 100%; background: var(--text-2); }
.fan-end { fill: var(--text); font: 700 13px var(--font); paint-order: stroke; stroke: var(--card); stroke-width: 4px; stroke-linejoin: round; }
.l-rachas, .l-otras { display: flex; flex-direction: column; }
.l-rachas > .chart { flex: 1 1 auto; }
.tbl.otras th:nth-child(2) { text-align: right; }
.tbl.otras td:first-child { white-space: nowrap; }
.tbl.otras .bar-c { width: auto; min-width: 64px; }
.tbl.otras td:last-child { white-space: nowrap; }
.tbl.otras td, .tbl.otras th { padding: 4px 6px; }
.tbl.jug { table-layout: fixed; }
@media (max-width: 1499px) { .lab-kpis { grid-template-columns: minmax(0, 1.45fr) repeat(3, minmax(0, 1fr)); } .lab-kpis .kpi .k { white-space: nowrap; } }
@media (min-width: 1280px) { .lab-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } }
@media (max-width: 1023px) {
  .lab-cambiar { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; height: auto; min-height: 52px; padding: 8px 14px; margin: 0 0 10px; text-align: left; white-space: normal; }
  .lab-cambiar span { font-weight: 500; font-size: var(--fs-cap); }
  .lab-src .rule { display: none; }
}
@media (max-width: 767px) {
  .lab-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lab-kpis .kpi.hero { grid-column: 1 / -1; }
  .lab .mk-rail .seg.sm button { min-height: 44px; }
  .tbl.otras tr { height: auto; }
}
#fanBox { min-height: 336px; }
.fan-wait svg { height: 250px; }
@media (max-width: 767px) { #fanBox { min-height: 360px; } }
.fan-st { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(2, minmax(0, .7fr)) minmax(0, 1fr) minmax(0, 1.3fr); gap: 6px 12px; margin: 8px 0 0; padding-top: 8px; border-top: 1px solid var(--line); }
.fan-st dt { font-size: var(--fs-cap); color: var(--text-2); line-height: 1.25; }
.fan-st dd { margin: 2px 0 0; font-size: var(--fs-row); font-weight: 700; font-variant-numeric: tabular-nums; }
@media (max-width: 767px) { .fan-st { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .jug-cols { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; } }

/* ---------- v3 ---------- */
.l-curve { display: flex; flex-direction: column; }
.l-curve > .chart { flex: 1 1 auto; }
.fan-st > div { display: flex; flex-direction: column; }
.fan-st dd { margin-top: auto; padding-top: 2px; }
/* paño del riel vertical (3 columnas de 12): celdas de 26 px con 13 px */
.lab .pgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; }
.lab .pgrid .pn { order: var(--o); height: 26px; font-size: 13px; letter-spacing: 0; }
.lab .pano { grid-template-columns: minmax(0, 1fr); }
.lab .pano > .pn { height: 26px; }
@media (max-width: 767px) {
  .lab-kpis .kpi:nth-child(2) { grid-column: 1 / -1; }
  .lab .pgrid .pn, .lab .pano > .pn { height: 44px; }
}
@media (max-width: 400px) { .tbl.otras td:first-child, .tbl.otras td:last-child, .tbl.otras th { white-space: normal; } .tbl.otras { font-size: var(--fs-cap); } }
/* v5: «3 de 200» nunca se parte */
.fan-st dd { white-space: nowrap; }
@media (min-width: 768px) and (max-width: 1499px) { .fan-st { grid-template-columns: minmax(0, 1.5fr) repeat(4, minmax(0, 1fr)); } .fan-st dt { white-space: normal; } }
@media (max-width: 767px) { .tbl.otras td:last-child { white-space: nowrap; } }
.fan-st { column-gap: 14px; }
/* v5: desde 1280 las 8 cifras en una fila compacta (el eje del gráfico entra en la primera pantalla de 630) */
@media (min-width: 1280px) and (max-width: 1499px) {
  .lab-kpis { grid-template-columns: minmax(0, 1.3fr) repeat(7, minmax(0, 1fr)); gap: 6px; }
  .lab-kpis .kpi { padding: 6px 8px 7px; }
  .lab-kpis .kpi .k { white-space: normal; }
  .lab-kpis .kpi .v { font-size: 17px; }
  .lab-kpis .kpi.hero .v { font-size: 24px; }
  .lab-kpis .kpi .v small { font-size: 13px; }
  .lab-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .l-fan .leg { column-gap: 10px; }
}
/* v6 · 1280–1499: la tabla de otras progresiones entra en su mitad (sin barras; encabezados en 2 líneas) */
@media (min-width: 1280px) and (max-width: 1499px) {
  .tbl.otras .bar-c { display: none; }
  .tbl.otras th { white-space: normal; line-height: 1.2; vertical-align: bottom; }
  .lab-kpis .kpi .d { white-space: nowrap; }
  .lab-kpis { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1.05fr) minmax(0, .85fr) minmax(0, .9fr) minmax(0, 1.3fr) minmax(0, .85fr) minmax(0, .9fr) minmax(0, 1.15fr); }
}
@media (max-width: 767px) { .tbl.otras td { padding-top: 0; padding-bottom: 0; } .tbl.otras .lnk { min-height: 44px; } }
@media (min-width: 1280px) and (max-width: 1499px) { #fanBox { min-height: 286px; } .fan-wait svg { height: 200px; } }
/* celular: el selector de vista del gráfico a su contenido (sin partir «Contra ficha fija») */
@media (max-width: 767px) { .cv-sel { grid-auto-columns: auto; grid-template-columns: 1fr 1fr auto; } .cv-sel button { white-space: nowrap; } }
/* sin cuenta: el aviso compacto arriba de las cifras */
.lab-src + .gate { margin: 0 0 10px; }
