/* Estructura y componentes según fabrica/look-and-feel/guia.md; los colores salen solo de tokens.css */
:root{--ok:#1e7d4f}
@media (prefers-color-scheme:dark){:root:not([data-tema='claro']){--ok:#5fd39b}}
:root[data-tema='oscuro']{--ok:#5fd39b}
*{box-sizing:border-box}
body{margin:0;font:15px system-ui,-apple-system,sans-serif;color:var(--texto);background:var(--fondo)}
button,select,input{font:inherit;color:var(--texto-fuerte)}
button{cursor:pointer;border:1px solid var(--borde-fuerte);border-radius:8px;padding:8px 14px;background:var(--fondo)}
button.primary{background:var(--efinfo-azul);border-color:var(--efinfo-azul);color:#fff}
:root[data-tema='oscuro'] button.primary{color:#0b1b27}
@media (prefers-color-scheme:dark){:root:not([data-tema='claro']) button.primary{color:#0b1b27}}
:focus-visible{outline:3px solid var(--efinfo-azul);outline-offset:2px}
a{color:var(--efinfo-azul)}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 20px;border-bottom:1px solid var(--borde);flex-wrap:wrap}
header .marca{display:flex;align-items:center;gap:12px}header img{height:34px;max-width:100%}header .ruta{color:var(--texto-suave)}
header .der{display:flex;align-items:center;gap:8px;color:var(--texto-suave);font-size:13px;flex-wrap:wrap}
.tira{background:var(--azul-suave);color:var(--texto-fuerte);padding:8px 20px;font-size:13px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.layout{display:grid;grid-template-columns:260px minmax(360px,1fr) 330px;min-height:calc(100vh - 100px)}
.layout.sin-izq{grid-template-columns:0 minmax(360px,1fr) 330px}.layout.sin-der{grid-template-columns:260px minmax(360px,1fr) 0}.layout.sin-izq.sin-der{grid-template-columns:0 1fr 0}
.sin-izq .izq,.sin-der .der-col{display:none}
aside{padding:18px;background:var(--fondo-suave);min-width:0}.izq{border-right:1px solid var(--borde)}.der-col{border-left:1px solid var(--borde)}
main{padding:22px 28px;background:var(--fondo);min-width:0}
.etq{font-size:11px;font-weight:700;letter-spacing:1.8px;color:var(--texto-suave);text-transform:uppercase;margin:0 0 10px}
nav a{display:block;padding:9px 10px;margin-bottom:4px;color:var(--texto-fuerte);text-decoration:none;border-left:3px solid transparent;border-radius:0 8px 8px 0}
nav a.act{background:var(--azul-suave);border-left-color:var(--efinfo-azul)}
label.f{display:block;font-size:12px;color:var(--texto-suave);margin:10px 0 3px}
select,input[type=date],input[type=text]{width:100%;padding:7px;border:1px solid var(--borde-fuerte);border-radius:8px;background:var(--fondo)}
select:disabled{opacity:.7}.nota{font-size:12px;color:var(--texto-suave);margin:3px 0 0}
h1{font-size:24px;margin:0 0 6px;color:var(--texto-fuerte);overflow-wrap:anywhere}h2{font-size:16px;margin:0 0 10px;color:var(--texto-fuerte)}
.ruta-act{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:10px 0 18px;font-size:13px}
.chip{background:var(--azul-suave);border:1px solid var(--borde);border-radius:999px;padding:3px 10px;color:var(--texto-fuerte)}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:18px}
.card{border:1px solid var(--borde);border-radius:8px;padding:14px;background:var(--fondo);min-width:0}
.kpi b{display:block;font-size:24px;color:var(--texto-fuerte);margin:4px 0;overflow-wrap:anywhere}.kpi small{color:var(--texto-suave)}
.sube{color:var(--ok);font-weight:600}.baja{color:var(--efinfo-rojo);font-weight:600}
.dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-bottom:18px}
.barra{display:grid;grid-template-columns:minmax(80px,130px) minmax(0,1fr) 44px;gap:8px;align-items:center;font-size:13px;margin:7px 0}
.barra i{display:block;height:12px;border-radius:4px;background:var(--efinfo-azul)}.barra i.gris{background:var(--borde-fuerte)}
.barra .pista{background:var(--fondo-suave);border-radius:4px}.barra span:last-child{text-align:right;color:var(--texto-suave)}
table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:8px;border-bottom:1px solid var(--borde);text-align:left;vertical-align:top}
th{color:var(--texto-suave);font-weight:600;font-size:12px}.tabla{overflow-x:auto;max-width:100%}
.conf{font-weight:600}.conf.baja{color:var(--efinfo-rojo)}
.chipst{display:inline-block;font-size:11px;padding:2px 8px;border-radius:999px;background:var(--azul-suave);color:var(--texto-fuerte)}
.chipst.rojo{background:transparent;border:1px solid var(--efinfo-rojo);color:var(--efinfo-rojo)}
.acc{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.vacio{color:var(--texto-suave);font-style:italic}
.fila-t{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.vista{display:none}.vista.act{display:block}
.te-toca{border-left:3px solid var(--efinfo-azul)}
.nota-sup{margin-top:14px}.nota-sup h2{margin-bottom:4px;overflow-wrap:anywhere}.nota-sup .meta{font-size:12px;color:var(--texto-suave);margin:0 0 6px}
.nota-sup .texto{margin:6px 0;overflow-wrap:anywhere}.corregir{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px;margin-top:10px}
.err{color:var(--efinfo-rojo);font-size:13px;margin:6px 0}
.arbol ul{margin:4px 0;padding-left:18px}
#toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--texto-fuerte);color:var(--fondo);padding:10px 16px;border-radius:8px;display:none;max-width:90vw;z-index:9}
#toast.on{display:block}
@media(max-width:1000px){
 .layout,.layout.sin-izq,.layout.sin-der,.layout.sin-izq.sin-der{display:block}
 .izq,.der-col{display:block;border:0;border-bottom:1px solid var(--borde)}
 .sin-izq .izq,.sin-der .der-col{display:none}
 #nav{display:flex;gap:4px;flex-wrap:wrap}#nav a{border:1px solid var(--borde);border-radius:8px}#nav a.act{border-color:var(--efinfo-azul)}
 .kpis,.dos{grid-template-columns:minmax(0,1fr)}main{padding:16px}header,.tira{padding-left:12px;padding-right:12px}
}
.sep{margin-top:20px}.sep12{margin-top:12px}.m6{margin:6px 0}.m0{margin:0}
[hidden]{display:none!important}
.w0{width:0%}.w1{width:1%}.w2{width:2%}.w3{width:3%}.w4{width:4%}.w5{width:5%}.w6{width:6%}.w7{width:7%}.w8{width:8%}.w9{width:9%}.w10{width:10%}.w11{width:11%}.w12{width:12%}.w13{width:13%}.w14{width:14%}.w15{width:15%}.w16{width:16%}.w17{width:17%}.w18{width:18%}.w19{width:19%}.w20{width:20%}.w21{width:21%}.w22{width:22%}.w23{width:23%}.w24{width:24%}.w25{width:25%}.w26{width:26%}.w27{width:27%}.w28{width:28%}.w29{width:29%}.w30{width:30%}.w31{width:31%}.w32{width:32%}.w33{width:33%}.w34{width:34%}.w35{width:35%}.w36{width:36%}.w37{width:37%}.w38{width:38%}.w39{width:39%}.w40{width:40%}.w41{width:41%}.w42{width:42%}.w43{width:43%}.w44{width:44%}.w45{width:45%}.w46{width:46%}.w47{width:47%}.w48{width:48%}.w49{width:49%}.w50{width:50%}.w51{width:51%}.w52{width:52%}.w53{width:53%}.w54{width:54%}.w55{width:55%}.w56{width:56%}.w57{width:57%}.w58{width:58%}.w59{width:59%}.w60{width:60%}.w61{width:61%}.w62{width:62%}.w63{width:63%}.w64{width:64%}.w65{width:65%}.w66{width:66%}.w67{width:67%}.w68{width:68%}.w69{width:69%}.w70{width:70%}.w71{width:71%}.w72{width:72%}.w73{width:73%}.w74{width:74%}.w75{width:75%}.w76{width:76%}.w77{width:77%}.w78{width:78%}.w79{width:79%}.w80{width:80%}.w81{width:81%}.w82{width:82%}.w83{width:83%}.w84{width:84%}.w85{width:85%}.w86{width:86%}.w87{width:87%}.w88{width:88%}.w89{width:89%}.w90{width:90%}.w91{width:91%}.w92{width:92%}.w93{width:93%}.w94{width:94%}.w95{width:95%}.w96{width:96%}.w97{width:97%}.w98{width:98%}.w99{width:99%}.w100{width:100%}
