
/* Layout: barra superior fija con pestañas; cada pestaña = resumen (tiles) + exhibits (barras, tablas) en una columna de 1200px. */
:root{
  --bg:#f6f7f4; --surface:#ffffff; --fg:#1b2430; --muted:#5d6b7a; --line:#dde3e8; --accent:#0f6e8c; --accent-soft:#e0eff4;
  --bar:#1f8aa8; --bar2:#c7772a; --good:#2e7d4f; --warn:#b7791f; --crit:#b23a3a; --chip:#eef1ee;
  --display:"Source Serif 4",Georgia,serif; --body:"Source Sans 3","Segoe UI",system-ui,sans-serif; --mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --bg:#121a21; --surface:#1a242d; --fg:#e8edf1; --muted:#9aa8b5; --line:#2c3842; --accent:#5fc3e0; --accent-soft:#1d3440; --bar:#4fb3d2; --bar2:#e09a4e; --good:#5fc48c; --warn:#e0b45a; --crit:#e07070; --chip:#243039; color-scheme:dark } }
:root[data-theme="dark"]{ --bg:#121a21; --surface:#1a242d; --fg:#e8edf1; --muted:#9aa8b5; --line:#2c3842; --accent:#5fc3e0; --accent-soft:#1d3440; --bar:#4fb3d2; --bar2:#e09a4e; --good:#5fc48c; --warn:#e0b45a; --crit:#e07070; --chip:#243039; color-scheme:dark }
*{box-sizing:border-box} body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:15px;line-height:1.45;margin:0}
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--surface);border-bottom:1px solid var(--line);padding:10px 16px 0}
.top .ttl{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}
h1{font-family:var(--display);font-size:22px;margin:0;text-wrap:balance} .sub{color:var(--muted);font-size:13px;font-family:var(--mono)}
.tabs{display:flex;gap:2px;overflow-x:auto;margin-top:8px} .tabs button{background:none;border:0;border-bottom:3px solid transparent;padding:8px 12px;font:600 14px var(--body);color:var(--muted);cursor:pointer;white-space:nowrap}
.tabs button[aria-selected="true"]{color:var(--accent);border-color:var(--accent)} .tabs button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
main{max-width:1200px;margin:0 auto;padding-block:16px 48px;padding-inline:16px} section[hidden]{display:none}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:18px}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:10px 12px;min-width:0} .tile b{display:block;font-size:26px;font-family:var(--mono);font-weight:500;font-variant-numeric:tabular-nums} .tile span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em} .tile small{display:block;color:var(--muted);font-size:12px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;margin-bottom:18px} .grid>*{min-width:0}
h2{font-family:var(--display);font-size:17px;margin:18px 0 8px} h3{font-size:14px;margin:0 0 8px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:12px 14px;min-width:0}
.bars{display:grid;grid-template-columns:minmax(90px,38%) 1fr auto;gap:4px 8px;align-items:center;font-size:13px} .bars .l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .bars .b{height:14px;background:var(--bar);border-radius:2px;min-width:2px} .bars .b.alt{background:var(--bar2)} .bars .v{font-family:var(--mono);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.cols{display:flex;align-items:flex-end;gap:2px;height:120px;border-bottom:1px solid var(--line);padding-bottom:2px;overflow:hidden} .cols div{flex:1 1 0;background:var(--bar);border-radius:2px 2px 0 0;min-width:1px;position:relative} .cols div:hover::after{content:attr(data-t);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:var(--fg);color:var(--bg);font:12px var(--mono);padding:2px 6px;border-radius:3px;white-space:nowrap;z-index:2}
.axis{display:flex;justify-content:space-between;font:11px var(--mono);color:var(--muted);margin-top:3px}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 10px} .filters input,.filters select{font:14px var(--body);padding:6px 8px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--fg);min-width:0} .filters input{flex:1 1 180px}
.tw{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:6px} table{border-collapse:collapse;width:100%;font-size:13px} th,td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top} th{position:sticky;top:0;background:var(--surface);font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);cursor:pointer;white-space:nowrap} th.s::after{content:" ↓"} td.n{font-family:var(--mono);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap} td.t{max-width:380px}
.chip{display:inline-block;background:var(--chip);border-radius:3px;padding:1px 6px;font-size:12px;margin:1px 2px 1px 0;white-space:nowrap} .chip.alta{background:var(--good);color:#fff} .chip.media{background:var(--warn);color:#fff} .chip.revisar{background:var(--accent-soft);color:var(--accent)} .chip.noaplica{background:var(--crit);color:#fff}
.meter{display:inline-block;width:60px;height:8px;background:var(--chip);border-radius:2px;vertical-align:middle;margin-right:4px;overflow:hidden} .meter i{display:block;height:100%;background:var(--accent)}
.promo{display:grid;grid-template-columns:72px 1fr;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)} .promo img{width:72px;height:72px;object-fit:cover;border-radius:4px;background:var(--chip)} .promo .ph{width:72px;height:72px;border-radius:4px;background:var(--chip)} .promo .m{font-weight:700} .promo .p{color:var(--accent);font-weight:600} .promo .x{color:var(--muted);font-size:13px} .promo a{color:var(--accent);font-size:12px}
.note{font-size:13px;color:var(--muted);margin:6px 0 14px} .more{font:600 13px var(--body);color:var(--accent);background:none;border:1px solid var(--line);border-radius:4px;padding:6px 10px;cursor:pointer;margin-top:8px} a{color:var(--accent)}
@media (max-width:600px){ .tile b{font-size:22px} td.t{max-width:220px} }
@media (prefers-reduced-motion:reduce){ *{transition:none!important} }
