/* Layout: una sola columna de lectura, como una pieza de datos de periódico. Titulares que afirman algo, gráficos con anotaciones y fuentes debajo. Fondo hueso, cabecera granate y acento verde salvia. */
:root{
  --bg:#f6f4ef; --band:#ebeee6; --ink:#1d1c1a; --ink-2:#4a4743; --muted:#7a756c; --rule:#e2e0d8; --rule-2:#cfcbc0; --strong:#2a2826; --card:#ffffff;
  --brand:#6e1423; --brand-2:#8a1c2d; --acc:#a9c9a4; --acc-ink:#3f7a4a;
  --rust:#b0303f; --mustard:#b07a14; --slate:#2e6fb0; --olive:#5f7a2e; --plum:#7a4f8a; --stone:#a69690;
  --s-mun:var(--rust); --s-prov:var(--mustard); --s-es:var(--slate);
  --mark:#d6e7d2; --pos:#b0303f; --neg:#2e6fb0;
  --div-mid:#ebe8e1; --div-neg:#2e6fb0; --div-neg2:#b9cde4;
  --ramp-0:#f4ebd9; --ramp-1:#ebd0ae; --ramp-2:#dda88a; --ramp-3:#c77a6c; --ramp-4:#a7485a; --ramp-5:#7a2238; --ramp-6:#4e1019;
  --nodata:#e3e0d8; --geo-line:#f6f4ef; --ctx:#e8e5dd; --on-dark:#ffffff; --on-light:#1f1a1b;
  color-scheme:light;
  --font:"Libre Franklin", "Franklin Gothic Medium", "Helvetica Neue", Arial, sans-serif;
}

:root[data-theme="dark"]{
  --bg:#191a17; --band:#22241f; --ink:#ecebe6; --ink-2:#c6c3ba; --muted:#959187; --rule:#33352f; --rule-2:#47493f; --strong:#e6e4dd; --card:#20221e;
  --brand:#4a0e18; --brand-2:#5e1520; --acc:#a9c9a4; --acc-ink:#a9c9a4;
  --rust:#d0505f; --mustard:#a8851f; --slate:#5b8ad6; --olive:#8c9850; --plum:#a882c0; --stone:#6f6260;
  --mark:#33503a; --pos:#e0707c; --neg:#7ea4dc;
  --div-mid:#34352f; --div-neg:#6b93d0; --div-neg2:#34475f;
  --ramp-0:#3a1d22; --ramp-1:#5e2532; --ramp-2:#843342; --ramp-3:#a8505a; --ramp-4:#c97c74; --ramp-5:#e2aa8e; --ramp-6:#f2d6b2;
  --nodata:#2a2b26; --geo-line:#191a17; --ctx:#2a2b26; color-scheme:dark }

*{box-sizing:border-box}
html,body{background:var(--bg)}
body{margin:0}
body{color:var(--ink); font-family:var(--font); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility}
button,input,select{font:inherit; color:inherit}
a{color:inherit; text-decoration-color:var(--acc-ink); text-decoration-thickness:1.5px; text-underline-offset:3px}
a:hover{color:var(--brand-2)}
:focus-visible{outline:2px solid var(--acc-ink); outline-offset:2px}
h1,h2,h3,h4{text-wrap:balance; margin:0}
p{margin:0}
b,strong{font-weight:700}
mark{background:linear-gradient(transparent 55%, var(--mark) 55%); color:inherit; padding:0 1px}
.num{font-variant-numeric:tabular-nums lining-nums}
.wrap{max-width:1120px; margin:0 auto; padding-left:max(18px,env(safe-area-inset-left,0px)); padding-right:max(18px,env(safe-area-inset-right,0px))}
.measure{max-width:680px}
.muted{color:var(--muted)}

/* cabecera */
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:30; background:var(--brand)}
.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:20; background:var(--brand); color:#fff}
.top-in{display:flex; align-items:center; gap:10px 26px; flex-wrap:wrap; padding-block:12px}
.logo{font-weight:800; font-size:21px; letter-spacing:-.01em; text-decoration:none; display:inline-flex; align-items:center; gap:8px; color:#fff}
.logo svg{display:block; height:27px; width:auto}
.logo:hover{color:#fff}
.nav{display:flex; gap:2px 4px; flex-wrap:wrap; font-size:15px; align-items:center}
.nav a,.nav .ddb{text-decoration:none; color:rgba(255,255,255,.85); padding:4px 12px; border-radius:20px; border:0; background:none; cursor:pointer; font:inherit}
.nav a:hover,.nav .ddb:hover{background:rgba(255,255,255,.1)}
.nav a:hover{color:#fff}
.nav a[aria-current="page"],.nav .ddb[aria-current="page"]{background:var(--acc); color:var(--brand); font-weight:700}
.ddb:after{content:" ▾"; opacity:.7}
.ddm a{display:block; color:var(--ink)!important; border-radius:6px; padding:8px 10px; font-size:14.5px}
.ddm a small{display:block; color:var(--muted); font-size:12.5px}
.ddm a:hover{background:var(--band)}
.search{position:relative; margin-left:auto; flex:0 1 250px; min-width:180px}
.search input{width:100%; padding:7px 12px 7px 34px; border:1px solid var(--rule-2); border-radius:6px; background:var(--bg); font-size:15px}
.top .search input{background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.28); color:#fff}
.top .search input::placeholder{color:rgba(255,255,255,.72)}
.top .search svg{color:rgba(255,255,255,.75)}
.search input:focus{outline:none; border-color:var(--ink)}
.top .search input:focus{border-color:var(--acc); background:rgba(255,255,255,.18)}
.search svg{position:absolute; left:11px; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none}
.results{position:absolute; left:0; right:0; top:calc(100% + 4px); background:var(--bg); color:var(--ink); border:1px solid var(--rule-2); border-radius:6px; list-style:none; margin:0; padding:4px; max-height:340px; overflow:auto; z-index:40; box-shadow:0 8px 24px rgba(0,0,0,.12)}
.results li{display:flex; justify-content:space-between; gap:12px; padding:7px 10px; cursor:pointer; font-size:15px; border-radius:4px}
.results li[aria-selected="true"], .results li:hover{background:var(--band)}
.results small{color:var(--muted); white-space:nowrap; font-size:13px}
.qg .go time,.k-m{font-weight:400; color:var(--muted)} .qg .go time{float:right; font-size:12.5px; margin-top:2px}
.byline{font-size:14px; color:var(--muted); margin-top:10px} .byline a{color:inherit}
.q-next{display:flex; gap:18px; flex-wrap:wrap; margin:26px 0 8px}
.top-in{gap:10px 18px} .search{flex:0 1 210px; min-width:150px}
/* móvil: dos filas (logo · buscador · tu municipio / secciones), no tres */
@media (max-width:760px){ .top-in{padding-block:8px; gap:6px 10px} .logo{font-size:22px; order:1} .logo svg{height:24px}
  .search{order:2; flex:1 1 0; min-width:0; margin-left:0} .search input{font-size:14px; padding:6px 8px 6px 30px}
  .nav{order:4; width:100%; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin:0 -16px; padding:0 16px; width:calc(100% + 32px); -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent); mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)} .nav::-webkit-scrollbar{display:none} .nav a,.nav .ddb{white-space:nowrap; padding:5px 10px; font-size:14.5px} }

main{padding-block:34px 64px}
.loading{color:var(--muted); padding:40px 0}

/* cabecera de página */
.phead::before{content:""; width:52px; height:6px; background:var(--acc); border-radius:1px}
.phead{display:flex; flex-direction:column; gap:12px; padding-bottom:30px; margin-bottom:8px; border-bottom:1px solid var(--rule)}
.phead h1{font-size:clamp(30px,4.4vw,44px); line-height:1.08; font-weight:800; letter-spacing:-.018em; max-width:20ch}
.phead .dek{font-size:clamp(18px,1.9vw,21px); line-height:1.5; color:var(--ink-2); max-width:640px}
.crumbs{font-size:14px; color:var(--muted)}
.crumbs a{color:var(--muted)}

/* bloques de hallazgo: titular que afirma, texto, gráfico, fuente */
.finding{display:flex; flex-direction:column; gap:14px; padding-block:34px; border-bottom:1px solid var(--rule)}
.finding:last-child{border-bottom:0}
.finding > h2{font-size:clamp(22px,2.5vw,27px); line-height:1.22; font-weight:700; letter-spacing:-.01em; max-width:30ch}
.finding > p, .finding .txt{max-width:680px; color:var(--ink-2)}
.finding .txt p + p{margin-top:10px}
.split{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:20px 44px; align-items:start}
.split > .txt{display:flex; flex-direction:column; gap:12px}
.split > .txt h2{font-size:clamp(22px,2.4vw,26px); line-height:1.22; font-weight:700; letter-spacing:-.01em; color:var(--ink)}
@media (max-width:860px){ .split{grid-template-columns:minmax(0,1fr)} }
.more{font-size:15px; font-weight:600}
.cols2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 40px}
@media (max-width:760px){ .cols2{grid-template-columns:minmax(0,1fr)} }
h3.sub{font-size:18px; font-weight:700; margin-bottom:6px}

/* explicación al margen */
.aside{background:var(--band); border-left:3px solid var(--acc); padding:14px 18px; font-size:15.5px; color:var(--ink-2); max-width:720px}
.aside b{color:var(--ink)}
.aside p + p{margin-top:8px}

/* figuras */
figure{margin:0; position:relative; min-width:0}
figure .ct{font-size:15px; font-weight:700; margin-bottom:2px}
figure .cs{font-size:14px; color:var(--muted); margin-bottom:6px}
figcaption{font-size:13px; color:var(--muted); margin-top:6px; line-height:1.45}
figure svg{display:block; width:100%; height:auto; overflow:visible}
.axis text, text.lab{fill:var(--muted); font-family:var(--font); font-size:11.5px; font-variant-numeric:tabular-nums}
text.strong{fill:var(--ink); font-weight:700}
text.dl{font-family:var(--font); font-size:12px; font-weight:600}
.grid line{stroke:var(--rule)}
.ctip,.maptip{position:absolute; pointer-events:none; background:var(--bg); border:1px solid var(--rule-2); border-radius:6px; box-shadow:0 6px 18px rgba(0,0,0,.10); padding:7px 10px; font-size:13px; z-index:6; line-height:1.4}
.maptip{transform:translate(-50%,-118%); white-space:nowrap}
.ctip{min-width:160px}
.ctip .y{font-weight:700; margin-bottom:3px}
.ctip div.r{display:flex; justify-content:space-between; gap:14px}
.ctip div.r span{display:inline-flex; align-items:center; gap:6px; color:var(--ink-2)}
.ctip i{width:9px; height:9px; border-radius:50%; display:inline-block}
.keys{display:flex; flex-wrap:wrap; gap:4px 16px; font-size:13.5px; color:var(--ink-2)}
.keys span{display:inline-flex; align-items:center; gap:6px}
.keys i{display:inline-block; width:18px; height:3px; border-radius:2px}
.keys i.sq{width:11px; height:11px; border-radius:2px}
.seg{display:inline-flex; border:1px solid var(--rule-2); border-radius:6px; overflow:hidden; font-size:14px}
.seg button{border:0; background:none; padding:5px 12px; cursor:pointer; color:var(--ink-2)}
.seg button + button{border-left:1px solid var(--rule-2)}
.seg button[aria-pressed="true"]{background:var(--brand); color:#fff}
select.sel{border:1px solid var(--rule-2); border-radius:6px; background:var(--bg); padding:6px 10px; font-size:15px; max-width:100%}
label.fld{display:flex; flex-direction:column; gap:3px; font-size:13px; color:var(--muted)}
label.chk{display:flex; align-items:center; gap:7px; font-size:14px; color:var(--ink-2)}

/* barras horizontales simples */
.hbars{display:flex; flex-direction:column; gap:3px; font-size:14px}
.hbars .hb{display:grid; grid-template-columns:minmax(90px,150px) minmax(0,1fr) 68px; gap:10px; align-items:center}
.hbars .hb > span:first-child{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.hbars .hb .t{position:relative; height:12px}
.hbars .hb .t i{position:absolute; top:0; bottom:0; left:0; border-radius:0 2px 2px 0; background:var(--stone)}
.hbars .hb .t b.ref{position:absolute; top:-3px; bottom:-3px; width:1.5px; background:var(--ink)}
.hbars .hb em{font-style:normal; text-align:right; color:var(--ink-2); font-variant-numeric:tabular-nums}
.hbars .hb.me > span:first-child{font-weight:700}
.hbars.scroll{max-height:560px; overflow:auto; padding-right:6px}

/* barras 100 % apiladas */
.stack{display:flex; flex-direction:column; gap:9px; font-size:14px}
.stack .row{display:grid; grid-template-columns:110px minmax(0,1fr); gap:12px; align-items:center}
.stack .row > span{color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.stack .row.me > span{color:var(--ink); font-weight:700}
.stack .bar{display:flex; height:24px; gap:2px}
.stack .bar i{display:flex; align-items:center; justify-content:center; font-style:normal; font-size:12px; color:var(--on-dark); min-width:0; overflow:hidden; white-space:nowrap; font-variant-numeric:tabular-nums}
.stack .bar i.lt{color:var(--on-light)}
.stack .bar i:first-child{border-radius:3px 0 0 3px} .stack .bar i:last-child{border-radius:0 3px 3px 0}
@media (max-width:520px){ .stack .row{grid-template-columns:minmax(0,1fr); gap:3px} }

/* comparación municipio / provincia / España */
.cmp{display:flex; flex-direction:column; gap:12px; font-size:14.5px}
.cmp-row{display:grid; grid-template-columns:minmax(140px,1fr) minmax(0,2fr); gap:14px; align-items:center; padding-bottom:10px; border-bottom:1px solid var(--rule)}
.cmp-row:last-child{border-bottom:0; padding-bottom:0}
.cmp-row .n{font-weight:600}
.cmp-row .n small{display:block; font-weight:400; color:var(--muted); font-size:13px}
.bars{display:flex; flex-direction:column; gap:3px}
.bars .b{display:grid; grid-template-columns:minmax(0,1fr) 54px; gap:8px; align-items:center}
.bars .b span{height:7px; display:block; border-radius:0 2px 2px 0}
.bars .b em{font-style:normal; font-size:12.5px; text-align:right; color:var(--ink-2); font-variant-numeric:tabular-nums}
@media (max-width:520px){ .cmp-row{grid-template-columns:minmax(0,1fr)} }

/* mapa */
.mapbox{position:relative}
.mapbox svg{display:block; width:100%; height:auto}
.mapbox .mun{cursor:pointer}
.mapbox .sel{fill:none; stroke:var(--ink); stroke-width:2.2; pointer-events:none}
.maploading{display:grid; place-items:center; min-height:300px; color:var(--muted)}
.legend{display:flex; align-items:center; gap:6px 12px; font-size:13px; color:var(--ink-2); flex-wrap:wrap; margin-top:8px}
.legend .bar{display:flex; height:10px; flex:1 1 160px; max-width:240px; border-radius:2px; overflow:hidden}
.legend .bar i{flex:1}
.legend .help{flex-basis:100%; color:var(--muted)}
.legend .sw{display:inline-flex; align-items:center; gap:5px}
.legend .sw i{width:11px; height:11px; border-radius:2px; display:inline-block}
.declegend{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink-2); flex-wrap:wrap}
.declegend .bar{display:flex; height:14px; width:min(300px,100%); border-radius:2px; overflow:hidden}
.declegend .bar i{flex:1; display:flex; align-items:center; justify-content:center; font-style:normal; font-size:9.5px}

/* listas de municipios */
.lista h3{font-size:16px; font-weight:700; margin-bottom:4px}
.lista ol{list-style:none; margin:0; padding:0}
.lista li{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:baseline; padding:6px 0; border-bottom:1px solid var(--rule); font-size:15px}
.lista li a{font-weight:600; text-decoration:none}
.lista li a:hover{text-decoration:underline}
.lista li small{color:var(--muted); font-size:13px; margin-left:6px}
.lista li .v{font-variant-numeric:tabular-nums; color:var(--ink-2)}

/* ficha de municipio */
.mhead{display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:16px 40px; align-items:start; padding-bottom:26px; border-bottom:1px solid var(--rule)}
.mhead > div:first-child::before{content:""; display:block; width:52px; height:6px; background:var(--acc); border-radius:1px; margin-bottom:14px}
.mhead h1{font-size:clamp(34px,5vw,54px); line-height:1.02; font-weight:800; letter-spacing:-.02em; margin:6px 0 12px; overflow-wrap:anywhere}
.mhead .dek{font-size:clamp(18px,1.9vw,20px); color:var(--ink-2); max-width:640px}
.locator svg{display:block; width:100%; height:auto}
.locator figcaption{margin-top:2px}
@media (max-width:760px){ .mhead{grid-template-columns:minmax(0,1fr)} .locator{max-width:200px} }
.glance{width:100%; border-collapse:collapse; font-size:15px}
.glance th{font-weight:400; color:var(--muted); font-size:13px; text-align:left; padding:0 10px 6px 0; border-bottom:1px solid var(--rule-2)}
.glance th.r,.glance td.r{text-align:right}
.glance td{padding:8px 10px 8px 0; border-bottom:1px solid var(--rule); vertical-align:middle}
.glance tr.grp td{padding-top:18px; font-weight:700; font-size:14px; color:var(--ink); border-bottom:1px solid var(--rule-2)}
.glance td.lab small{display:block; color:var(--muted); font-size:12.5px}
.glance td.v{font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums}
.glance td.e{color:var(--ink-2); white-space:nowrap; font-variant-numeric:tabular-nums}
.glance td.pos{width:34%}
.strip{position:relative; height:16px}
.strip::before{content:""; position:absolute; left:0; right:0; top:7px; height:2px; background:var(--rule-2); border-radius:1px}
.strip .mid{position:absolute; left:50%; top:2px; width:1px; height:12px; background:var(--muted)}
.strip .dot{position:absolute; top:2px; width:12px; height:12px; border-radius:50%; background:var(--rust); border:2px solid var(--bg); box-shadow:0 0 0 1px var(--rust); transform:translateX(-50%)}
.strip-ends{display:flex; justify-content:space-between; font-size:12px; color:var(--muted)}
@media (max-width:620px){ .glance td.pos,.glance th.pos{display:none} }
.jump{position:sticky; top:calc(env(safe-area-inset-top,0px) + var(--toph,58px)); z-index:15; background:var(--bg); border-bottom:1px solid var(--rule); display:flex; gap:4px 18px; overflow-x:auto; scrollbar-width:none; padding-block:10px; margin-top:26px; font-size:15px}
.jump::-webkit-scrollbar{display:none}
.jump button{border:0; background:none; padding:0; cursor:pointer; color:var(--ink-2); white-space:nowrap}
.jump button:hover{color:var(--ink); text-decoration:underline; text-decoration-color:var(--acc-ink)}
.msec{scroll-margin-top:120px}
.msec > h2{font-size:clamp(24px,2.8vw,30px); font-weight:800; letter-spacing:-.015em; margin:44px 0 10px}
.msec > .lead{font-size:18px; color:var(--ink-2); max-width:680px; margin-bottom:22px}
.msec .block{margin-top:26px}
.msec .block > h3{font-size:18px; font-weight:700; margin-bottom:10px}

/* voto */
.vtab{display:flex; flex-direction:column; gap:9px; font-size:15px}
.vhead,.vrow{display:grid; grid-template-columns:minmax(120px,1.2fr) minmax(0,2.4fr) 52px 58px 92px; gap:12px; align-items:center}
.vhead{font-size:12.5px; color:var(--muted); border-bottom:1px solid var(--rule-2); padding-bottom:6px}
.pn{display:flex; align-items:center; gap:8px; min-width:0; font-weight:600}
.pn i{width:11px; height:11px; flex:none; border-radius:2px}
.pn small{display:block; font-size:12.5px; color:var(--muted); line-height:1.25; font-weight:400}
.vbar{position:relative; display:flex; align-items:center; height:18px}
.vbar > span{height:12px; display:block; flex:none; border-radius:0 2px 2px 0}
.vbar .m19{position:absolute; top:0; bottom:0; width:2px; margin-left:-1px; background:var(--ink)}
.r{text-align:right}
.up{color:var(--pos)} .dn{color:var(--neg)}
@media (max-width:560px){ .vhead,.vrow{grid-template-columns:minmax(80px,1fr) minmax(0,1.4fr) 46px 50px} .hide-s{display:none} }

/* barrios */
.secc-tools{display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center; font-size:14px; margin-bottom:10px}
.secc-grid{display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:20px 34px; align-items:start}
@media (max-width:900px){ .secc-grid{grid-template-columns:minmax(0,1fr)} }
.secc-side{display:flex; flex-direction:column; gap:12px; font-size:15px}
.secc-side .big{font-size:26px; font-weight:800; font-variant-numeric:tabular-nums; line-height:1.1}
.secc-side dl{display:grid; grid-template-columns:auto 1fr; gap:4px 14px; margin:0}
.secc-side dt{color:var(--muted)} .secc-side dd{margin:0; font-variant-numeric:tabular-nums}
.fronteras{list-style:none; margin:0; padding:0; display:flex; flex-direction:column}
.fronteras li{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,2fr) 56px; gap:12px; align-items:center; padding:8px 0; border-bottom:1px solid var(--rule); font-size:15px}
.fronteras li a{font-weight:600; text-decoration:none}
.fronteras li a:hover{text-decoration:underline}
.fronteras .pair{display:flex; align-items:center; gap:8px; color:var(--ink-2); font-size:14px; font-variant-numeric:tabular-nums; flex-wrap:wrap}
.fronteras .pair i{width:12px; height:12px; display:inline-block; border-radius:2px}
.fronteras b.x{text-align:right; font-variant-numeric:tabular-nums}
@media (max-width:620px){ .fronteras li{grid-template-columns:minmax(0,1fr) 50px} .fronteras .pair{grid-column:1/-1} }
.citytip{cursor:pointer}
.citytip:hover text.city{fill:var(--rust)}

/* relaciones */
.xform{display:flex; flex-wrap:wrap; gap:12px 18px; align-items:flex-end; padding:16px 0 18px; border-bottom:1px solid var(--rule)}
.xform .swap{border:1px solid var(--rule-2); border-radius:6px; background:var(--bg); padding:6px 10px; cursor:pointer}
.xres{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,4fr); gap:24px 40px; padding-top:22px; align-items:start}
@media (max-width:900px){ .xres{grid-template-columns:minmax(0,1fr)} }
.xsay{display:flex; flex-direction:column; gap:16px}
.xsay .big{font-size:21px; line-height:1.4; font-weight:600}
.stat{display:grid; grid-template-columns:minmax(0,1fr); gap:3px; padding-top:12px; border-top:1px solid var(--rule)}
.stat .k{font-size:13px; color:var(--muted)}
.stat .v{font-size:16px}
.stat .v b{font-size:22px; font-variant-numeric:tabular-nums}
.rscale{position:relative; height:24px; margin-top:4px}
.rscale .ln{position:absolute; left:0; right:0; top:10px; height:4px; border-radius:2px; background:linear-gradient(90deg,var(--neg),var(--div-mid) 50%,var(--pos))}
.rscale .mk{position:absolute; top:4px; width:4px; height:16px; background:var(--ink); border-radius:2px; transform:translateX(-50%)}
.rscale-ends{display:flex; justify-content:space-between; font-size:12px; color:var(--muted)}
.caveat{font-size:14.5px; color:var(--ink-2)}
.caveat ul{margin:6px 0 0; padding-left:18px}
.caveat li{margin:3px 0}
.matrix{overflow-x:auto}
.matrix table{border-collapse:separate; border-spacing:2px; font-size:12.5px}
.matrix th{font-weight:500; color:var(--ink-2); text-align:right; padding-right:6px; white-space:nowrap}
.matrix thead th{text-align:left; vertical-align:bottom; padding:0 0 4px; height:150px; white-space:nowrap}
.matrix thead th span{display:inline-block; transform:rotate(-55deg); transform-origin:left bottom; width:22px; translate:14px -4px}
.matrix td{width:34px; height:28px; text-align:center; cursor:pointer; border-radius:3px; font-variant-numeric:tabular-nums}
.matrix td.self{cursor:default}
.matrix td:hover{outline:2px solid var(--ink)}
.pairs{list-style:none; margin:0; padding:0}
.pairs li{padding:8px 0; border-bottom:1px solid var(--rule); font-size:15px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:baseline}
.pairs li a{text-decoration:none} .pairs li a:hover{text-decoration:underline}

.xsug{display:flex; flex-wrap:wrap; gap:8px; padding-top:18px; font-size:14px}
.xsug a{text-decoration:none; border:1px solid var(--rule-2); border-radius:20px; padding:4px 12px; color:var(--ink-2)}
.xsug a:hover{border-color:var(--rust); color:var(--ink)}
.scsay{font-size:15px; color:var(--ink-2); margin-bottom:8px; max-width:680px}
.scsay a{font-weight:600}
.scat-wrap{position:relative}
.scat-wrap canvas{display:block; width:100%; height:auto}
.scat-wrap svg{position:absolute; inset:0; width:100%; height:100%; pointer-events:none}
.scat-wrap .maptip{white-space:normal; min-width:150px; transform:translate(-50%,-112%)}
.ccaa{display:flex; flex-direction:column; gap:5px; font-size:14px}
.ccaa .row{display:grid; grid-template-columns:minmax(110px,170px) minmax(0,1fr) 74px; gap:12px; align-items:center}
.ccaa .row > span:first-child{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ccaa .bar{display:flex; height:18px; border-radius:2px; overflow:hidden}
.ccaa .bar i{display:block}
.ccaa em{font-style:normal; text-align:right; color:var(--ink-2); font-variant-numeric:tabular-nums}
@media (max-width:520px){ .ccaa .row{grid-template-columns:minmax(0,1fr) 70px} .ccaa .bar{grid-column:1/-1; grid-row:2} }

.seg.sm{font-size:13px; margin-bottom:8px} .seg.sm button{padding:4px 10px}
ul.defs{margin:6px 0 0; padding-left:18px; max-width:680px; color:var(--ink-2)} ul.defs li{margin:4px 0}
ul.destaca{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 34px}
@media (max-width:760px){ ul.destaca{grid-template-columns:minmax(0,1fr)} }
ul.destaca li{display:grid; grid-template-columns:14px minmax(0,1fr); gap:10px; padding:10px 0; border-bottom:1px solid var(--rule); font-size:15.5px}
ul.destaca .dot{width:11px; height:11px; border-radius:50%; margin-top:6px}
ul.destaca .dot.hi{background:var(--rust)} ul.destaca .dot.lo{background:var(--slate)}
ul.destaca small{display:block; color:var(--muted); font-size:13.5px; margin-top:2px}
.glance tr.me td{background:var(--band)}
a.cmpl{font-size:13.5px; font-weight:600}
.simtab{overflow-x:auto}
@media (max-width:620px){ .simtab th:nth-child(4),.simtab td:nth-child(4),.simtab th:nth-child(6),.simtab td:nth-child(6){display:none} .simtab td,.simtab th{padding-right:6px} }
.vtab.mun .vrow{grid-template-columns:minmax(120px,1.5fr) minmax(0,2fr) 52px}
.cmpbar{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 24px; padding:18px 0; border-bottom:1px solid var(--rule); align-items:end}
@media (max-width:620px){ .cmpbar{grid-template-columns:minmax(0,1fr)} }
.cmpbar .who{font-size:13px; color:var(--muted); display:flex; align-items:center; gap:8px; margin-bottom:4px}
.cmpbar .who i{width:12px; height:12px; border-radius:2px; display:inline-block}
.cmpbar .nm{font-size:26px; font-weight:800; line-height:1.15}
.cmptab td.a,.cmptab td.b{font-weight:500; white-space:nowrap; font-variant-numeric:tabular-nums}
.cmptab td.win{color:var(--ink); font-weight:800} .cmptab td.dim{color:var(--muted)}

.evo{display:grid; grid-template-columns:minmax(220px,300px) minmax(0,1fr); gap:24px 40px; padding-top:20px; align-items:start}
@media (max-width:860px){ .evo{grid-template-columns:minmax(0,1fr)} }
.evo-ctl{display:flex; flex-direction:column; gap:10px; font-size:14.5px}
.evo-ctl .fld > span{display:block; font-size:13px; color:var(--muted); margin-bottom:4px}
.evo-g{border:0; border-top:1px solid var(--rule); margin:0; padding:8px 0 0}
.evo-g legend{font-size:13px; font-weight:700; padding:0 6px 0 0}
.evo-g label.chk{padding:3px 0; font-size:14.5px; align-items:flex-start} .evo-g label.chk input{margin-top:5px}
ul.evo-sum{list-style:none; margin:16px 0 8px; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 28px}
@media (max-width:620px){ ul.evo-sum{grid-template-columns:minmax(0,1fr)} }
ul.evo-sum li{display:grid; grid-template-columns:12px minmax(0,1fr) auto; gap:10px; align-items:baseline; padding:8px 0; border-bottom:1px solid var(--rule)}
ul.evo-sum i{width:12px; height:4px; border-radius:2px; display:inline-block; transform:translateY(-3px)}
ul.evo-sum b{font-variant-numeric:tabular-nums}

.labnav{display:flex; gap:4px 22px; flex-wrap:wrap; align-items:baseline; background:var(--band); border:1px solid var(--rule); border-radius:10px; padding:12px 16px; margin-bottom:22px}
.labnav .lt{font-weight:800; font-size:17px; margin-right:6px}
.labnav .lt small{display:block; font-weight:400; font-size:12.5px; color:var(--muted)}
.labnav a{text-decoration:none; color:var(--ink-2); font-size:15px; padding:2px 0; border-bottom:2px solid transparent}
.labnav a[aria-current="page"]{color:var(--ink); font-weight:700; border-bottom-color:var(--rust)}
.doors{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:22px 0 6px}
@media (max-width:760px){ .doors{grid-template-columns:minmax(0,1fr)} }
.door{border:1px solid var(--rule-2); border-radius:12px; padding:20px 22px; background:var(--bg); display:flex; flex-direction:column; gap:10px}
.door.lab{background:var(--brand); color:#fff; border-color:var(--brand)}
.door .k{font-size:12.5px; text-transform:uppercase; letter-spacing:.06em; font-weight:700; color:var(--rust)}
.door.lab .k{color:var(--acc)}
.door h2{font-size:24px; line-height:1.2; font-weight:800}
.door p{color:var(--ink-2); font-size:15.5px} .door.lab p{color:rgba(255,255,255,.85)}
.door .go{display:inline-block; align-self:flex-start; background:var(--acc); color:var(--brand); font-weight:700; text-decoration:none; border-radius:20px; padding:7px 16px; font-size:15px}
.door .tools{display:flex; flex-wrap:wrap; gap:6px} .door .tools a{color:#fff; font-size:14px; border:1px solid rgba(255,255,255,.35); border-radius:20px; padding:3px 10px; text-decoration:none}
.exhead{padding-bottom:18px}
.exq{display:flex; flex-wrap:wrap; gap:8px; font-size:14px; padding:4px 0 18px; align-items:center}
.exq a{text-decoration:none; border:1px solid var(--rule-2); border-radius:20px; padding:4px 12px; color:var(--ink-2); background:var(--bg)}
.exq a:hover{border-color:var(--rust); color:var(--ink)}
.extabs{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0; border:1px solid var(--rule-2); border-radius:8px; overflow:hidden}
.extabs button{border:0; border-right:1px solid var(--rule-2); background:var(--bg); text-align:left; padding:10px 12px; cursor:pointer; display:flex; flex-direction:column; gap:2px}
.extabs button:last-child{border-right:0}
.extabs button b{font-size:15px} .extabs button span{font-size:12.5px; color:var(--muted); line-height:1.3}
.extabs button[aria-selected="true"]{background:var(--brand); color:#fff} .extabs button[aria-selected="true"] span{color:rgba(255,255,255,.8)}
@media (max-width:900px){ .extabs{grid-template-columns:repeat(3,minmax(0,1fr))} .extabs button:nth-child(3){border-right:0} .extabs button:nth-child(-n+3){border-bottom:1px solid var(--rule-2)} }
@media (max-width:520px){ .extabs button span{display:none} }
.exbar{display:flex; flex-direction:column; gap:10px; padding:16px 0; border-bottom:1px solid var(--rule)}
.exrow{display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center}
.exlab{font-size:13px; color:var(--muted); min-width:80px}
.exhint{font-size:13px}
.chips{display:flex; flex-wrap:wrap; gap:6px; align-items:center}
.chip{display:inline-flex; align-items:center; border:1px solid var(--rule-2); border-radius:20px; background:var(--bg); font-size:14px}
.chip.first{border-color:var(--rust); box-shadow:inset 0 0 0 1px var(--rust)} .chip.second{border-color:var(--slate)}
.chip button{border:0; background:none; cursor:pointer; padding:4px 4px 4px 12px; color:var(--ink)}
.chip .cx{padding:4px 10px 4px 4px; color:var(--muted)}
.exout{padding-top:20px; min-height:300px}
.exmap{display:grid; grid-template-columns:minmax(0,7fr) minmax(0,4fr); gap:20px 36px}
@media (max-width:860px){ .exmap{grid-template-columns:minmax(0,1fr)} }
.exmap .lista + .lista{margin-top:18px}
.extable{overflow-x:auto; max-width:100%; min-width:0}
.extable .sortb{border:0; background:none; cursor:pointer; color:var(--muted); font-size:13px; text-align:right; padding:0}
.extable .sortb.on{color:var(--ink); font-weight:700}
.exgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 40px}
@media (max-width:860px){ .exgrid{grid-template-columns:minmax(0,1fr)} }
.exshare{padding:20px 0 0; font-size:14px}
.exshare button{border:1px solid var(--rule-2); border-radius:6px; background:var(--bg); padding:6px 12px; cursor:pointer}
a.exlink{font-size:14px; font-weight:600}
.causal .big{font-size:19px; line-height:1.45; font-weight:600; max-width:760px}
ul.semaforo{list-style:none; margin:6px 0 0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 32px}
@media (max-width:760px){ ul.semaforo{grid-template-columns:minmax(0,1fr)} }
ul.semaforo li{display:grid; grid-template-columns:22px minmax(0,1fr); gap:10px; padding:10px 0; border-bottom:1px solid var(--rule); font-size:15px}
ul.semaforo small{display:block; color:var(--ink-2); font-size:13.5px; margin-top:2px}
ul.semaforo .ic{width:16px; height:16px; border-radius:50%; margin-top:4px; background:var(--nodata)}
ul.semaforo li.ok .ic{background:#4f8a5b} ul.semaforo li.ko .ic{background:var(--rust)} ul.semaforo li.warn .ic{background:var(--mustard)}
.homeq{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:6px}
@media (max-width:900px){ .homeq{grid-template-columns:repeat(2,minmax(0,1fr))} }
.homeq a{display:flex; flex-direction:column; gap:4px; text-decoration:none; border:1px solid var(--rule-2); border-radius:8px; padding:12px 14px; background:var(--bg)}
.homeq a:hover{border-color:var(--rust)} .homeq a b{font-size:15.5px; line-height:1.3} .homeq a span{font-size:12.5px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em}

.studies{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:24px 0 8px}
@media (max-width:760px){ .studies{grid-template-columns:minmax(0,1fr)} }
.study{display:flex; flex-direction:column; gap:6px; text-decoration:none; border:1px solid var(--rule-2); border-radius:10px; padding:18px 20px; background:var(--bg)}
.study:hover{border-color:var(--rust)} .study span{font-size:12.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--rust); font-weight:700}
.study b{font-size:20px; line-height:1.25} .study p{color:var(--ink-2); font-size:15px}

.calc{display:grid; grid-template-columns:minmax(0,3fr) minmax(0,2fr); gap:20px 36px; align-items:start; background:var(--band); border-radius:10px; padding:18px 20px}
@media (max-width:760px){ .calc{grid-template-columns:minmax(0,1fr)} }
.calc .ctl{display:flex; flex-direction:column; gap:16px}
.calc label{display:flex; flex-direction:column; gap:4px; font-size:15px; font-weight:600}
.calc label output{font-weight:800; color:var(--rust)}
.calc input[type=range]{width:100%; accent-color:var(--rust)}
.calc small{font-weight:400; color:var(--muted); font-size:13px}
.calc .res .big{font-size:34px; font-weight:800; line-height:1.1}
.calc .res p{margin-top:8px; color:var(--ink-2)}

/* pie */
.method{font-size:14px; color:var(--ink-2); display:flex; flex-direction:column; gap:8px; border-top:1px solid var(--rule-2); padding-top:16px; margin-top:56px}
.method p{max-width:820px}
@media (prefers-reduced-motion: reduce){ *{transition:none!important; animation:none!important; scroll-behavior:auto!important} }
/* ===== rediseño: portada, ficha, temas, laboratorio ===== */
.kk{font-size:12px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--acc-ink)}
.gol{font-weight:700; font-size:14.5px; color:var(--rust); text-decoration:none}
.gol:hover{color:var(--brand-2)}
.cardx{border:1px solid var(--rule); border-radius:12px; background:var(--card); padding:16px 18px}
.chipsq{display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-top:12px; font-size:13.5px; color:var(--muted)}
.chipsq a,.chipsq button{border:1px solid var(--rule-2); border-radius:20px; padding:3px 11px; background:var(--card); color:var(--ink-2); text-decoration:none; cursor:pointer; font-size:13.5px}
.chipsq a:hover,.chipsq button:hover{border-color:var(--acc-ink); color:var(--ink)}
.bigsearch{margin-top:20px; max-width:none!important; flex:none!important}
.bigsearch input{padding:14px 16px 14px 42px!important; font-size:18px!important; border:2px solid var(--brand)!important; border-radius:12px!important; background:var(--card)!important}
.bigsearch svg{left:15px!important}
/* portada */
.ci-hero{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:34px; align-items:center; padding:40px 0 30px}
.ci-hero h1{font-size:clamp(36px,5vw,54px); line-height:1.04; letter-spacing:-.02em; font-weight:800; margin:8px 0 12px}
.ci-hero .dek{font-size:19px; color:var(--ink-2); max-width:600px; line-height:1.5}
.ci-viz{position:relative; min-height:300px}
.ci-map{background:var(--card); border:1px solid var(--rule); border-radius:16px; padding:10px 10px 6px; position:relative}
.ci-map svg{display:block; width:100%; height:auto}
.ci-map .mlab{display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:13px; color:var(--ink-2); padding:2px 6px 4px}
.ci-map .mlab b{color:var(--ink)}
.ci-map .dots{display:flex; gap:5px}
.ci-map .dots button{width:9px; height:9px; border-radius:50%; border:0; padding:0; background:var(--rule-2); cursor:pointer}
.ci-map .dots button[aria-pressed="true"]{background:var(--brand)}
.ci-stat{position:absolute; background:var(--card); border-radius:10px; box-shadow:0 6px 18px rgba(0,0,0,.12); padding:9px 13px; font-size:13px; line-height:1.35; max-width:200px; color:var(--ink-2); z-index:2}
.ci-stat b{display:block; font-size:23px; color:var(--rust); line-height:1.1}
.ci-paths{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:6px}
.ci-path{border-radius:14px; overflow:hidden; border:1px solid var(--rule); background:var(--card); text-decoration:none; color:inherit; display:flex; flex-direction:column; transition:transform .15s, box-shadow .15s}
.ci-path:hover{transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.08); color:inherit}
.ci-path .img{height:120px; background:var(--band); display:grid; place-items:center; overflow:hidden}
.ci-path .img svg{width:100%; height:100%}
.ci-path .tx{padding:14px 18px 16px}
.ci-path h3{margin:4px 0 6px; font-size:22px}
.ci-path p{color:var(--ink-2); font-size:14.5px; line-height:1.45; margin-bottom:10px}
.ci-path.lab{background:var(--brand); border-color:var(--brand); color:#fff}
.ci-path.lab .img{background:rgba(0,0,0,.18)}
.ci-path.lab p{color:rgba(255,255,255,.85)} .ci-path.lab .kk,.ci-path.lab .gol{color:var(--acc)}
.ci-band{background:var(--band); border-radius:16px; padding:24px 26px; margin-top:30px}
.ci-band h2{font-size:24px; margin-bottom:14px}
.g4{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.g3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
.qcard{display:block; text-decoration:none; color:inherit}
.qcard:hover{border-color:var(--acc-ink); color:inherit}
.qcard .n{font-size:30px; font-weight:800; color:var(--rust); line-height:1.05}
.qcard .t{font-weight:700; font-size:16px; margin:8px 0 4px; line-height:1.3}
.qcard .s{font-size:13.5px; color:var(--ink-2); line-height:1.4}
.qcard svg{display:block; width:100%; margin:8px 0 4px}
.ci-steps{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; padding:26px 0 8px}
.ci-steps div{display:grid; grid-template-columns:36px 1fr; gap:10px; font-size:14.5px; color:var(--ink-2); line-height:1.45}
.ci-steps i{font-style:normal; width:32px; height:32px; border-radius:50%; background:var(--acc); color:var(--brand); font-weight:800; display:grid; place-items:center}
.ci-steps b{display:block; color:var(--ink); font-size:16px}
@media (max-width:860px){ .ci-hero{grid-template-columns:minmax(0,1fr); padding-top:24px} .ci-paths,.g3,.ci-steps{grid-template-columns:minmax(0,1fr)} .g4{grid-template-columns:repeat(2,minmax(0,1fr))} .ci-viz{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; min-height:0} .ci-map{grid-column:1/-1} .ci-stat{position:static; max-width:none; box-shadow:none; border:1px solid var(--rule); font-size:12px; padding:8px 10px} .ci-stat b{font-size:19px} }
@media (max-width:460px){ .g4{grid-template-columns:minmax(0,1fr)} }
/* ficha */
.mf-hero{display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:30px; align-items:start; padding-top:26px}
.mf-hero h1{font-size:clamp(36px,5vw,50px); line-height:1.04; letter-spacing:-.02em; font-weight:800; margin:4px 0 10px}
.mf-hero .dek{font-size:18px; color:var(--ink-2); max-width:640px; line-height:1.5}
.mf-hero .locator{margin:0}
.mf-h2{font-size:24px; margin:34px 0 12px; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px}
.mf-h2 small{font-size:13.5px; font-weight:400; color:var(--muted)}
.kpis{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.kpi{background:var(--card); border:1px solid var(--rule); border-radius:10px; padding:13px 16px 12px}
.kpi .l{font-size:13px; color:var(--muted)} .kpi .v{font-size:27px; font-weight:800; margin:1px 0 9px; font-variant-numeric:tabular-nums}
.bul{position:relative; height:8px; background:linear-gradient(90deg,var(--band),var(--mark)); border-radius:4px}
.bul .me{position:absolute; top:-4px; width:5px; height:16px; border-radius:2px; background:var(--rust); transform:translateX(-50%)}
.bul .es{position:absolute; top:-6px; width:2px; height:20px; background:var(--ink); transform:translateX(-50%)}
.bul-l{display:flex; justify-content:space-between; gap:6px; font-size:12px; color:var(--muted); margin-top:7px}
.bul-l b{color:var(--ink-2); font-weight:600; text-align:center}
.smalls{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.sm{background:var(--card); border:1px solid var(--rule); border-radius:10px; padding:12px 14px 10px}
.sm .t{font-size:14px; font-weight:700} .sm .d{font-size:13px; color:var(--ink-2); min-height:2.6em}
.sm svg{display:block; width:100%; margin-top:6px; overflow:visible}
.smkey{display:flex; gap:14px; font-size:12.5px; color:var(--muted); margin-top:8px}
.smkey i{display:inline-block; width:16px; height:0; border-top:2.5px solid var(--rust); vertical-align:middle; margin-right:5px}
.smkey i.es{border-top:1.5px dashed var(--muted)}
.dest{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px}
.dest > div{background:var(--card); border:1px solid var(--rule); border-radius:10px; padding:12px 14px; font-size:14.5px; line-height:1.4}
.dest .pct{display:block; font-size:21px; font-weight:800; color:var(--rust)}
.dest .pct.lo{color:var(--slate)}
.dest small{display:block; font-size:12.5px; color:var(--muted); margin-top:4px}
.dstrip{position:relative; height:8px; margin:10px 0 2px; border-radius:4px; background:linear-gradient(90deg,var(--band),var(--mark))}
.dstrip i{position:absolute; top:-4px; width:16px; height:16px; border-radius:50%; background:var(--rust); border:2px solid var(--card); transform:translateX(-50%)}
.acc{border-top:1px solid var(--rule-2)}
.accrow{border-bottom:1px solid var(--rule)}
.accrow > button{all:unset; box-sizing:border-box; width:100%; cursor:pointer; display:grid; grid-template-columns:28px minmax(0,1fr) 150px 74px; gap:12px; align-items:center; padding:13px 4px}
.accrow > button:focus-visible{outline:2px solid var(--acc-ink)}
.accrow > button:hover{background:color-mix(in srgb,var(--band) 60%,transparent)}
.accrow .ic{font-size:20px; color:var(--rust); font-weight:700; text-align:center; transition:transform .2s}
.accrow[open] .ic{transform:rotate(45deg)}
.accrow b{font-size:17px} .accrow .sum{display:block; font-size:14px; color:var(--ink-2); margin-top:2px}
.accrow .mini svg{display:block; width:150px; height:26px}
.accrow .ch{font-size:12.5px; color:var(--muted); text-align:right}
.accrow .accb{padding:4px 0 26px}
.accrow .accb > .msec{padding-top:0; border-top:0}
@media (max-width:760px){ .mf-hero{grid-template-columns:minmax(0,1fr)} .mf-hero .locator{max-width:220px} .kpis{grid-template-columns:repeat(2,minmax(0,1fr))} .smalls{grid-template-columns:repeat(2,minmax(0,1fr))} .dest{grid-template-columns:minmax(0,1fr)} .accrow > button{grid-template-columns:24px minmax(0,1fr) 70px} .accrow .ch{display:none} .accrow .mini svg{width:70px} }
@media (max-width:420px){ .kpi{padding:11px 12px} .kpi .v{font-size:21px} .bul-l span{display:none} .bul-l{justify-content:center} .kpi .l{font-size:12px} }
/* temas */
.tcard{border-radius:14px; background:var(--card); border:1px solid var(--rule); overflow:hidden; text-decoration:none; color:inherit; display:flex; flex-direction:column; transition:transform .15s, box-shadow .15s}
.tcard:hover{transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.08); color:inherit}
.tcard .img{height:96px; background:var(--band); padding:14px 18px} .tcard .img svg{display:block; width:100%; height:100%}
.tcard .tp{padding:14px 18px; flex:1} .tcard h3{margin:4px 0 6px; font-size:20px; line-height:1.25}
.tcard .n{font-size:30px; font-weight:800; color:var(--rust)} .tcard .s{font-size:13.5px; color:var(--ink-2)}
.tcard .ft{border-top:1px solid var(--rule); padding:9px 18px; font-size:13px; color:var(--muted); display:flex; justify-content:space-between}
.tp-crumb{font-size:13px; color:var(--muted); margin-bottom:6px} .tp-crumb a{color:var(--muted)}
.tp-ess{margin-top:22px} .tp-ess h2{font-size:22px; margin-bottom:12px}
.mestrip{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:10px 18px; align-items:center; background:var(--card); border:2px solid var(--acc); border-radius:12px; padding:12px 18px; margin-top:16px}
.mestrip .v{display:flex; gap:10px 26px; flex-wrap:wrap} .mestrip .v div{font-size:13px; color:var(--muted)} .mestrip .v b{display:block; font-size:20px; color:var(--ink)} .mestrip .v small{font-size:12px}
.mestrip .search{margin:0; flex:none; max-width:280px}
.toc{display:flex; gap:8px; flex-wrap:wrap; margin-top:16px}
.toc a{font-size:14px; border:1px solid var(--rule-2); border-radius:20px; padding:3px 12px; background:var(--card); text-decoration:none; color:var(--ink-2)}
.toc a:hover{border-color:var(--acc-ink); color:var(--ink)}
.gloss{border-bottom:2px dotted var(--acc-ink); cursor:help}
.gtip{position:absolute; z-index:40; background:var(--card); border:1px solid var(--rule-2); border-radius:8px; box-shadow:0 6px 18px rgba(0,0,0,.14); padding:10px 12px; font-size:13.5px; line-height:1.45; width:min(290px,80vw); color:var(--ink-2)}
.gtip b{color:var(--ink)}
.nextstep{display:flex; justify-content:space-between; align-items:center; gap:12px 20px; flex-wrap:wrap; border:2px solid var(--brand); border-radius:12px; padding:16px 20px; margin:30px 0 10px; background:var(--card)}
.nextstep .t{font-size:16px}
details.howm{margin-top:24px; border-top:1px solid var(--rule-2)}
details.howm > summary{cursor:pointer; padding:14px 0; font-weight:700; font-size:16px; color:var(--ink-2)}
details.howm .method{margin-top:0; border-top:0; padding-top:0}
@media (max-width:760px){ .mestrip{grid-template-columns:minmax(0,1fr)} }
/* laboratorio */
.lb{display:grid; grid-template-columns:290px minmax(0,1fr); gap:0; margin:18px 0 10px; border:1px solid var(--rule); border-radius:14px; overflow:hidden; background:var(--bg); min-height:640px}
.lb-side{background:var(--card); border-right:1px solid var(--rule); padding:18px}
.lb-step{margin-bottom:20px}
.lb-step h4{margin:0 0 8px; font-size:12.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); display:flex; align-items:center}
.lb-step h4 i{font-style:normal; display:inline-grid; place-items:center; width:20px; height:20px; border-radius:50%; background:var(--acc); color:var(--brand); margin-right:7px; font-size:12px}
.lb-step h4 small{margin-left:auto; text-transform:none; letter-spacing:0; font-weight:400}
.types{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px}
.types button{border:1px solid var(--rule-2); border-radius:8px; padding:7px 3px 5px; text-align:center; font-size:12px; color:var(--ink-2); background:var(--bg); cursor:pointer; line-height:1.2}
.types button svg{display:block; margin:0 auto 4px}
.types button:hover{border-color:var(--acc-ink)}
.types button[aria-pressed="true"]{border:2px solid var(--brand); padding:6px 2px 4px; background:var(--card); color:var(--ink); font-weight:700}
.types button[aria-pressed="true"] svg *{fill:var(--rust); stroke:var(--rust)}
.types button[aria-pressed="true"] svg polyline{fill:none}
.slot{border:1.5px dashed var(--rule-2); border-radius:8px; padding:6px 8px 6px 10px; font-size:14px; margin-bottom:6px; display:flex; justify-content:space-between; align-items:center; gap:6px; background:var(--bg)}
.slot.full{border-style:solid; border-color:var(--rust); background:var(--card)}
.slot small{display:block; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em}
.slot .nm{min-width:0; overflow:hidden; text-overflow:ellipsis}
.slot button{border:0; background:none; cursor:pointer; color:var(--muted); font-size:16px; padding:0 4px}
.slot select{max-width:100%; width:100%; border:0; background:transparent; padding:2px 0; font-size:14px; cursor:pointer}
.lb-side .sel{width:100%; margin-bottom:6px}
.lb-side .search{margin:0 0 6px; flex:none; max-width:none}
.lb-side .chk{display:flex; font-size:13.5px; margin:3px 0}
.lb-side .chipsq{gap:5px} .lb-side .chipsq button{font-size:12.5px; padding:2px 9px; width:auto; flex:none}
#exswap,#exgo{font-size:14px}
.lbedit{display:none}
.lb-side .hint{font-size:12.5px; color:var(--muted); line-height:1.4; margin:4px 0 0}
.lb-canvas{padding:16px 22px 22px; min-width:0}
.lb-bar{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; flex-wrap:wrap; margin-bottom:8px}
.lb-bar h2{font-size:20px; line-height:1.25}
.lb-bar .sub{font-size:13px; color:var(--muted); margin-top:2px}
.acts{display:flex; gap:6px; flex-wrap:wrap}
.acts button{border:1px solid var(--rule-2); border-radius:6px; padding:4px 10px; background:var(--card); font-size:13px; cursor:pointer}
.acts button:hover{border-color:var(--acc-ink)}
.lb-out{min-height:300px}
.lb-out .exmap{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr)}
.lb-out .evo{grid-template-columns:minmax(0,1fr)!important; display:block}
#lbevo .evo-ctl{position:static; max-height:none}
.reading{display:grid; grid-template-columns:minmax(0,1fr); gap:14px; margin-top:16px}
.say{background:var(--card); border-left:4px solid var(--acc-ink); border-radius:6px; padding:12px 16px; font-size:15.5px; line-height:1.55}
.nb{background:var(--card); border:1px solid var(--rule); border-radius:10px; padding:10px 14px; margin-top:16px; font-size:13.5px}
.nb .list{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px}
.nb .list a{display:inline-flex; align-items:center; gap:6px; border:1px solid var(--rule-2); border-radius:8px; padding:5px 8px 5px 10px; text-decoration:none; background:var(--bg); font-size:13px; max-width:280px}
.nb .list a span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.nb .list button{border:0; background:none; cursor:pointer; color:var(--muted); padding:0}
.lb-empty{border:2px dashed var(--rule-2); border-radius:16px; padding:34px 28px; text-align:center; background:var(--card); margin:22px 0 10px}
.lb-empty h1{font-size:clamp(28px,4vw,38px); margin:6px 0 10px; line-height:1.1}
.lb-empty .dek{margin:0 auto; max-width:640px; color:var(--ink-2); font-size:17px}
.lb-empty .g3{margin-top:24px; text-align:left}
.lb-empty .cardx h3{font-size:17px; margin:6px 0 8px}
.lb-empty .cardx a{display:block; font-size:14.5px; margin:5px 0}
.lb-empty .cardx .types{margin-top:6px}
@media (max-width:860px){ .lbedit{display:inline-block} .lb-canvas{order:1} .lb-side{order:2; border-top:1px solid var(--rule)} .lb{grid-template-columns:minmax(0,1fr)} .lb-side{border-right:0; border-bottom:1px solid var(--rule)} .lb-out .exmap{grid-template-columns:minmax(0,1fr)} .lb-canvas{padding:14px} }
/* ¿causa o casualidad? */
.cz{background:var(--card); border:1px solid var(--rule); border-radius:14px; padding:18px 20px; margin-top:16px}
.cz h3{font-size:20px; margin-bottom:4px}
.cz .intro{color:var(--ink-2); font-size:15px; max-width:700px; line-height:1.5}
.meter{margin:16px 0 6px}
.meter .track{display:grid; grid-template-columns:repeat(4,1fr); gap:4px}
.meter .track span{height:12px; border-radius:3px; background:var(--band)}
.meter .track span.on{background:var(--acc-ink)}
.meter .track span.on.l0{background:var(--stone)} .meter .track span.on.l1{background:var(--mustard)}
.meter .labs{display:grid; grid-template-columns:repeat(4,1fr); gap:4px; font-size:12px; color:var(--muted); margin-top:5px; line-height:1.25}
.meter .labs b{color:var(--ink)}
.verdict{font-size:18px; font-weight:700; margin-top:10px}
.verdict small{display:block; font-size:14.5px; font-weight:400; color:var(--ink-2); margin-top:4px; line-height:1.5}
.tests{list-style:none; padding:0; margin:16px 0 0; display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:10px}
.tests li{border:1px solid var(--rule); border-radius:10px; padding:12px 14px; background:var(--bg); font-size:14px; line-height:1.45}
.tests li .h{display:flex; align-items:center; gap:8px; font-weight:700; font-size:15px; margin-bottom:4px}
.tests li .em{font-size:18px; line-height:1}
.tests li .why{display:block; margin-top:8px; font-size:13px; color:var(--muted); border-top:1px solid var(--rule); padding-top:6px}
.tests li.ok{border-color:color-mix(in srgb,var(--acc-ink) 50%,var(--rule))}
.tests li.ko{border-color:color-mix(in srgb,var(--rust) 40%,var(--rule))}
.suspect{margin-top:14px; background:var(--band); border-radius:10px; padding:12px 16px; font-size:15px; line-height:1.5}
.suspect .tag{display:inline-block; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--brand); margin-right:6px}
.reverse{margin-top:10px; font-size:14px; color:var(--ink-2)}
.tryit{margin-top:14px; font-size:14px} .tryit .row{display:flex; flex-wrap:wrap; gap:4px 14px; margin-top:6px} .tryit .res{margin-top:8px}
@media (max-width:760px){ .tests{grid-template-columns:minmax(0,1fr)} .meter .labs{font-size:11px} }
/* menú desplegable y globo */
.navdd{position:relative}
.ddm{position:fixed; background:var(--card); color:var(--ink); border:1px solid var(--rule-2); border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.18); padding:6px; width:290px; max-width:calc(100vw - 24px); z-index:60}
.cztags{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:12px 0 4px}
.cztags .lab{font-size:13.5px; font-weight:700; color:var(--ink-2); margin-right:4px}
.ctag{border:1.5px solid var(--rule-2); background:var(--card); border-radius:20px; padding:5px 12px; font-size:13.5px; cursor:pointer; color:var(--ink); line-height:1.3}
.ctag:hover:not(:disabled){border-color:var(--acc-ink)}
.ctag[aria-pressed="true"]{background:var(--acc); border-color:var(--acc-ink); color:var(--brand); font-weight:700}
.ctag:disabled{opacity:.4; cursor:default}
.ctag.sus{border-color:var(--mustard)} .ctag small{font-size:11.5px; color:var(--mustard); font-weight:700}
.ctag.act{border-style:dashed}
.ctlnote{display:flex; justify-content:space-between; align-items:center; gap:8px 14px; flex-wrap:wrap; background:var(--mark); border-radius:8px; padding:8px 12px; font-size:14px; margin-bottom:8px}
.ctlnote button{border:1px solid var(--acc-ink); background:var(--card); border-radius:6px; padding:3px 10px; font-size:13px; cursor:pointer}
.czbar{margin:10px 0 4px}
.czb-h{font-size:14.5px; margin-bottom:6px} .czb-h .muted{font-size:13px; margin-left:6px}
.czb-t{display:flex; height:26px; border-radius:6px; overflow:hidden; background:var(--band)}
.czb-t span{display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; white-space:nowrap; overflow:hidden; transition:flex .6s ease}
.czb-t .keep{background:var(--acc-ink); color:#fff}
.czb-t .lost{background:repeating-linear-gradient(135deg,var(--rule-2),var(--rule-2) 6px,var(--band) 6px,var(--band) 12px); color:var(--ink-2); border-left:2px solid var(--card)}
.czb-s{font-size:14px; color:var(--ink-2); margin-top:6px}
.czmini svg{display:block; width:100%; max-width:220px; margin-top:8px}
.twins{margin-top:16px} .twins h4{font-size:15px; margin:0 0 2px} .twins p{font-size:13px}
.twins ul{list-style:none; padding:0; margin:8px 0 0}
.twins li{display:grid; grid-template-columns:20px minmax(0,1fr) auto minmax(0,1fr) auto; gap:4px 10px; align-items:baseline; padding:7px 0; border-bottom:1px solid var(--rule); font-size:14.5px}
.twins li small{display:block; color:var(--muted); font-size:12px}
.twins li .vs{font-size:12px; color:var(--muted)} .twins .ok{color:var(--acc-ink); font-weight:800} .twins .ko{color:var(--rust); font-weight:800}
.tests li.na{opacity:.75}
@media (max-width:620px){ .twins li{grid-template-columns:20px minmax(0,1fr) minmax(0,1fr)} .twins li .vs,.twins li .gol{display:none} }
/* ===== guía de elementos pulsables (una sola familia) =====
   1 Enlaces de texto: subrayado verde.   2 Acciones «→»: granate en negrita.
   3 Botones: rectángulo redondeado con borde.   4 Pastillas: chips y filtros; pulsadas = verde.
   5 Tarjetas pulsables: se elevan al pasar y llevan «→». Las tarjetas que no se pulsan no reaccionan. */
:root{ --hit:color-mix(in srgb, var(--mark) 55%, var(--card)); --ring:0 0 0 3px color-mix(in srgb, var(--acc-ink) 35%, transparent) }
input[type=checkbox],input[type=radio]{accent-color:var(--acc-ink); width:16px; height:16px; cursor:pointer}
label.chk{cursor:pointer}
.lista li a,.glance td a,.twins a:not(.gol),.vrow a{text-decoration:underline; text-decoration-color:var(--rule-2); text-decoration-thickness:1.5px; text-underline-offset:3px}
.lista li a:hover,.glance td a:hover,.twins a:not(.gol):hover{text-decoration-color:var(--acc-ink); color:var(--brand-2)}
.gol,a.exlink,a.cmpl{color:var(--rust); font-weight:700; text-decoration:none; white-space:normal}
.gol:hover,a.exlink:hover,a.cmpl:hover{text-decoration:underline; text-decoration-color:currentColor}
a.exlink::after{content:""}
/* 3 botones */
button.sel,.acts button,.ctlnote button,#exmore,#excsv,#excopy,.door .go,.nb .list a{
  display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:36px; padding:6px 13px; border:1.5px solid var(--rule-2); border-radius:8px;
  background:var(--card); color:var(--ink); font-size:14px; font-weight:600; line-height:1.2; cursor:pointer; text-decoration:none; transition:border-color .15s, background .15s}
button.sel:hover,.acts button:hover,.ctlnote button:hover,#exmore:hover,#excsv:hover,.nb .list a:hover{border-color:var(--acc-ink); background:var(--hit)}
button.sel:active,.acts button:active,.ctag:active,.chipsq a:active,.chipsq button:active{transform:translateY(1px)}
select.sel{appearance:none; -webkit-appearance:none; min-height:36px; border:1.5px solid var(--rule-2); border-radius:8px; background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%237a756c' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat right 11px center; padding:6px 32px 6px 11px; font-size:14.5px; cursor:pointer}
select.sel:hover{border-color:var(--acc-ink)}
.slot select{appearance:none; -webkit-appearance:none; background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%237a756c' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat right 2px center; padding-right:20px; font-weight:600}
.slot{cursor:pointer; transition:border-color .15s, background .15s} .slot:hover{border-color:var(--acc-ink)} .slot.full:hover{background:var(--hit)}
.slot button{border-radius:6px} .slot button:hover{color:var(--rust); background:var(--hit)}
/* 4 pastillas */
.chipsq a,.chipsq button,.ctag,.toc a,.xsug a,.exq a,.door .tools a,.homeq-chip{
  display:inline-flex; align-items:center; gap:5px; border:1.5px solid var(--rule-2); border-radius:999px; background:var(--card); color:var(--ink-2); padding:4px 12px; font-size:13.5px; font-weight:500; line-height:1.3; text-decoration:none; cursor:pointer; transition:border-color .15s, background .15s, color .15s}
.chipsq a:hover,.chipsq button:hover,.ctag:hover:not(:disabled),.toc a:hover,.xsug a:hover,.exq a:hover{border-color:var(--acc-ink); background:var(--hit); color:var(--ink)}
.ctag[aria-pressed="true"],.chipsq [aria-pressed="true"]{background:var(--acc); border-color:var(--acc-ink); color:var(--brand); font-weight:700}
.ctag.act{border-style:dashed}
.seg{border:1.5px solid var(--rule-2); border-radius:8px; background:var(--card)}
.seg button{min-height:32px; transition:background .15s}
.seg button:hover{background:var(--hit); color:var(--ink)}
.seg button[aria-pressed="true"]{background:var(--acc); color:var(--brand); font-weight:700}
.types button{transition:border-color .15s, background .15s} .types button:hover{background:var(--hit)}
.types button[aria-pressed="true"]{border:2px solid var(--acc-ink); background:var(--hit); color:var(--brand)}
/* 5 tarjetas */
.cardx:not(a):hover{transform:none; box-shadow:none}
.qcard{transition:none} div.qcard:hover{border-color:var(--rule)}
a.cardx,a.qcard,a.tcard,a.ci-path,a.study,.homeq a{transition:transform .15s, box-shadow .15s, border-color .15s; cursor:pointer}
a.cardx:hover,a.qcard:hover,a.tcard:hover,a.study:hover,.homeq a:hover{transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.08); border-color:var(--acc-ink); color:inherit}
a.qcard .s{color:var(--rust); font-weight:600}
/* tablas ordenables */
.extable .sortb{color:var(--ink-2); border-radius:4px; padding:2px 4px}
.extable .sortb::after{content:" ↕"; color:var(--rule-2)} .extable .sortb.on::after{content:""}
.extable .sortb:hover{background:var(--hit); color:var(--ink)}
/* foco visible igual para todo */
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,.slot:focus-within{outline:none; box-shadow:var(--ring); border-radius:8px}
/* táctil: objetivos más grandes */
.acts .lbedit{display:none}
@media (max-width:860px){ .acts .lbedit{display:inline-flex} }
@media (pointer:coarse), (max-width:760px){
  .chipsq a,.chipsq button,.ctag,.toc a,.xsug a,.exq a{padding:7px 13px; min-height:38px}
  button.sel,.acts button,select.sel{min-height:42px}
  .seg button{min-height:40px}
  .nav a,.nav .ddb{padding:7px 13px}
}

/* quién soy */
.navsobre{opacity:.85}
.ab-hero{display:grid; grid-template-columns:150px minmax(0,1fr); gap:28px; align-items:center; padding:40px 0 26px}
.ab-hero h1{font-size:clamp(32px,4.4vw,46px); line-height:1.06; letter-spacing:-.02em; margin:6px 0 10px}
.ab-hero .dek{font-size:18px; color:var(--ink-2); max-width:640px; line-height:1.55}
.ab-foto{width:150px; height:150px; border-radius:50%; object-fit:cover; border:4px solid var(--acc)}
.ab-ph{display:grid; place-items:center; background:var(--mark); color:var(--brand); font-size:44px; font-weight:800}
.ab-sec{padding:34px 0 6px} .ab-sec h2{font-size:26px; margin-bottom:10px}
.ab-srv .ab-e{font-size:26px} .ab-srv p{font-size:14px; color:var(--ink-2); line-height:1.45; margin:4px 0 8px}
.ab-form{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:26px; margin-top:12px}
.ab-form form{display:flex; flex-direction:column; gap:12px; background:var(--card); border:1px solid var(--rule); border-radius:14px; padding:20px}
.ab-form .fld{display:flex; flex-direction:column; gap:5px; font-size:14px; font-weight:600; color:var(--ink-2)}
.inp{border:1.5px solid var(--rule-2); border-radius:8px; background:var(--bg); padding:9px 11px; font-size:16px; font-weight:400; color:var(--ink); width:100%}
.inp:hover{border-color:var(--acc-ink)} .inp:focus{outline:none; box-shadow:var(--ring); border-color:var(--acc-ink)}
textarea.inp{resize:vertical; min-height:110px}
.ab-send{align-self:flex-start; background:var(--brand)!important; color:#fff!important; border-color:var(--brand)!important; padding:8px 22px!important}
.ab-send:hover{background:var(--brand-2)!important}
.ab-side h3{font-size:17px; margin-bottom:6px}
.sitefoot{border-top:1px solid var(--rule); margin-top:40px; padding:22px 0 calc(22px + env(safe-area-inset-bottom,0px)); font-size:14px; color:var(--muted)}
.sitefoot .wrap{display:flex; justify-content:space-between; gap:10px 20px; flex-wrap:wrap}
.sitefoot nav{display:flex; gap:6px 16px; flex-wrap:wrap} .sitefoot a{color:var(--ink-2)}
.seg{max-width:100%; flex-wrap:wrap}
@media (max-width:400px){ .cmptab th,.cmptab td{padding-left:3px!important; padding-right:3px!important; font-size:13px} }
@media (max-width:760px){ .ab-hero{grid-template-columns:minmax(0,1fr); padding-top:24px} .ab-foto{width:96px; height:96px; font-size:30px} .ab-form{grid-template-columns:minmax(0,1fr)} }

/* mi municipio */
.mymun{display:inline-flex; align-items:center; gap:6px; margin-left:auto; border:1.5px solid rgba(255,255,255,.35); background:rgba(255,255,255,.08); color:#fff; border-radius:999px; padding:5px 12px 5px 10px; font-size:14px; cursor:pointer; max-width:280px; white-space:nowrap}
.mymun:hover{background:rgba(255,255,255,.18); border-color:var(--acc)}
.mymun .t{overflow:hidden; text-overflow:ellipsis} .mymun .t-short{display:none} .mymun small{opacity:.8} .mymun .c{opacity:.7; font-size:11px}
.top .search{margin-left:0}
.mypop{position:fixed; z-index:70; width:340px; max-width:calc(100vw - 20px); background:var(--card); color:var(--ink); border:1px solid var(--rule-2); border-radius:12px; box-shadow:0 14px 36px rgba(0,0,0,.2); padding:14px 16px 16px}
.mp-h{display:flex; justify-content:space-between; align-items:center; font-size:16px}
.mp-x{border:0; background:none; font-size:22px; line-height:1; cursor:pointer; color:var(--muted); padding:0 4px}
.mp-d{font-size:13px; color:var(--muted); margin:4px 0 10px}
.mp-cur{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; background:var(--hit); border-radius:8px; padding:8px 10px; margin-bottom:8px; font-size:15px}
.mp-cur small{color:var(--muted); font-size:12.5px} .mp-cur .gol{margin-left:auto; font-size:13px}
.mp-cur button{border:0; background:none; color:var(--muted); font-size:13px; cursor:pointer; text-decoration:underline}
.dot1,.dot2{width:10px; height:10px; border-radius:50%; background:var(--ink); align-self:center} .dot2{background:var(--slate)}
.mypop .search{margin:0; max-width:none; flex:none} .mypop .search input{background:var(--bg)}
.mp-sep{margin:14px 0 6px; font-size:14px; border-top:1px solid var(--rule); padding-top:12px}
.mp-cmp{display:block; margin-top:10px; font-weight:700; color:var(--rust); text-decoration:none; font-size:14px}
.toast{position:fixed; left:50%; bottom:calc(18px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%); z-index:80; background:var(--ink); color:#fff; border-radius:10px; padding:10px 14px; font-size:14px; box-shadow:0 10px 26px rgba(0,0,0,.25); max-width:calc(100vw - 24px); width:max-content; animation:tin .25s ease}
.toast button{margin-left:8px; border:1px solid rgba(255,255,255,.5); background:none; color:#fff; border-radius:6px; padding:2px 9px; cursor:pointer; font-size:13px}
@keyframes tin{from{opacity:0; transform:translate(-50%,8px)}}
.ismine{background:var(--acc)!important; border-color:var(--acc-ink)!important; color:var(--brand)!important; font-weight:700!important}
.ms2{display:block} .ms-h{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px}
.mst tr.me td{background:var(--hit)} .mst tr.m2 td:first-child{border-left:3px solid var(--slate)} .mst tr.me td:first-child{border-left:3px solid var(--ink)}
.lbmy{cursor:pointer}
@media (max-width:760px){ .mymun{order:3; margin-left:0; max-width:34%; padding:5px 9px 5px 8px; font-size:13px} .mymun small,.mymun .t-long{display:none} .mymun .t-short{display:inline} .top .search{flex:1 1 0; min-width:0} }

/* ====================================================================
   ESTILO EDITORIAL (octubre 2026): papel casi blanco, titulares en serifa,
   sin cajas; el granate es el único acento. Va al final para mandar.
   ==================================================================== */
:root{
  --bg:#fafaf8; --band:#f1f1ee; --card:#fafaf8; --ink:#1c1b19; --ink-2:#4c4b48; --muted:#878682; --rule:#e2e2de; --rule-2:#cdcdc8; --strong:#1c1b19;
  --brand:#8a2232; --brand-2:#6e1423; --acc:#ecd6d6; --acc-ink:#8a2232; --mark:#f3e3e3;
  --nodata:#e6e6e2; --geo-line:#fafaf8; --ctx:#ebebe7;
  --serif:"Newsreader", Georgia, "Times New Roman", serif;
  --hit:#f3e6e6; --ring:0 0 0 3px rgba(138,34,50,.22);
  /* semántica: granate = marca y énfasis; --ok/--ko solo para pruebas que pasan o fallan; --slate = serie de comparación (España) */
  --ok:#3f7a4a; --ko:#b0303f;
}
html,body{background:var(--bg)}
a{text-decoration-color:color-mix(in srgb, var(--brand) 55%, transparent)}
a:hover{color:var(--brand)}

/* titulares en serifa, sin negrita pesada */
h1,h2,.phead h1,.mhead h1,.ci-hero h1,.mf-hero h1,.finding > h2,.split > .txt h2,.ed-h2{font-family:var(--serif); font-weight:500; letter-spacing:-.015em}
h3{font-family:var(--serif); font-weight:500}
.phead h1{font-size:clamp(34px,5vw,54px); line-height:1.04; max-width:22ch}
.phead::before{height:3px; width:44px; background:var(--brand)}
.finding > h2,.split > .txt h2{font-size:clamp(23px,2.6vw,29px); line-height:1.2}
.phead .dek,.finding > p,.finding .txt,.dek{font-family:var(--serif); font-size:clamp(17.5px,1.8vw,20px); line-height:1.55}
.finding .txt p,.finding .txt li{font-family:var(--serif)}

/* cabecera clara */
body::before{background:var(--bg)}
.top{background:color-mix(in srgb, var(--bg) 94%, transparent); color:var(--ink); border-bottom:1px solid var(--rule); backdrop-filter:saturate(1.2) blur(8px); -webkit-backdrop-filter:saturate(1.2) blur(8px)}
.logo{color:var(--ink); font-family:var(--serif); font-weight:500; font-size:25px; letter-spacing:-.01em; gap:9px}
.logo:hover{color:var(--ink)}
.logo .lg-m{display:block; color:var(--ink)} .logo .lg-i{width:17px; height:17px; display:inline-grid; grid-auto-flow:column; align-items:end; gap:2px; padding:3px; background:var(--brand); border-radius:2px}
.logo .lg-i i{display:block; width:2.5px; background:#fff}
.nav a,.nav .ddb{color:var(--ink-2); border-radius:0; padding:6px 11px}
.nav a:hover,.nav .ddb:hover{background:none; color:var(--brand)}
.nav a[aria-current="page"],.nav .ddb[aria-current="page"]{background:none; color:var(--ink); font-weight:600; box-shadow:inset 0 -2px 0 var(--brand)}
.top .search input{background:transparent; border:0; border-bottom:1px solid var(--rule-2); border-radius:0; color:var(--ink)}
.top .search input::placeholder{color:var(--muted)}
.top .search svg{color:var(--muted)}
.top .search input:focus{border-color:var(--ink); background:transparent}
.mymun{color:var(--ink-2)!important}

/* fuera cajas: los bloques se separan con filetes, no con recuadros */
.cardx,.kpi,.sm,.dest > div,.tcard,.ci-path,.cz,.nb,.mestrip,.lb-empty,.ab-form form,.ci-map,.nextstep{background:transparent!important; border:0!important; border-top:1px solid var(--rule-2)!important; border-radius:0!important; box-shadow:none!important; padding-left:0; padding-right:0}
.cardx:hover,a.cardx:hover,.tcard:hover,.ci-path:hover{transform:none!important; box-shadow:none!important}
.nextstep{border-top:1px solid var(--ink)!important}
.aside,.say{background:transparent; border-left:2px solid var(--brand); border-radius:0}
.mestrip{border-top:2px solid var(--brand)!important}
/* controles: siguen pareciendo pulsables, pero más sobrios */
button.sel,.acts button,.chipsq a,.chipsq button,.toc a,.ctag,.ctlnote button,select.sel,.seg,.types button{border-radius:3px!important}
.bigsearch input{border:0!important; border-bottom:2px solid var(--ink)!important; border-radius:0!important; background:transparent!important; padding-left:34px!important; font-family:var(--serif); font-size:21px!important}
.bigsearch svg{left:4px!important}
.ddm,.mypop,.gtip,.ctip,.maptip,.results{border-radius:4px; background:#fff}
.sitefoot{border-top:1px solid var(--ink)}

/* ======================= PORTADA DE PREGUNTAS ======================= */
.qh{padding-top:clamp(18px,4vw,40px)}
.qh .kk2{font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--brand); font-weight:700}
.qh-q{font-family:var(--serif); font-weight:500; font-size:clamp(36px,6.4vw,70px); line-height:1.02; letter-spacing:-.022em; margin:12px 0 0; max-width:17ch; min-height:2.04em; text-wrap:balance}
.qh-q em{color:var(--brand)}
.qh-a{font-family:var(--serif); font-size:clamp(18px,2vw,21px); line-height:1.5; color:var(--ink-2); max-width:760px; margin-top:16px; min-height:4.5em}
.qh-a b{color:var(--ink); font-weight:600}
.qh-a a{color:var(--brand); font-weight:600; text-decoration:none; white-space:nowrap}
.qh-fade{transition:opacity .45s ease}
.qh-fade.out{opacity:0}
.qh-dots{display:flex; gap:6px; align-items:center; margin-top:18px}
.qh-dots button{width:26px; height:20px; border:0; background:none; padding:0; cursor:pointer; position:relative}
.qh-dots button::after{content:""; position:absolute; left:0; right:0; top:9px; height:3px; background:var(--rule-2)}
.qh-dots button[aria-pressed="true"]::after{background:var(--brand)}
.qh-dots .pp{width:auto; font-size:12px; color:var(--muted); margin-left:8px}
.qh-dots .pp::after{display:none}
.qh-art{margin-top:16px}
.qh-art svg{display:block; width:100%; height:auto}
.qh-cap{font-family:var(--serif); font-style:italic; font-size:15px; color:var(--ink-2); margin-top:6px; max-width:900px}
.ed-sec{border-top:1px solid var(--ink); margin-top:clamp(36px,6vw,56px); padding-top:16px}
.ed-k{font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:600}
.ed-h2{font-size:clamp(27px,3.4vw,36px); line-height:1.12; margin:4px 0 8px}
.qg{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:14px}
.qg > a{display:flex; flex-direction:column; padding:20px 26px 24px; border-right:1px solid var(--rule); text-decoration:none; color:inherit}
.qg > a:nth-child(3n+1){padding-left:0}
.qg > a:nth-child(3n){border-right:0; padding-right:0}
.qg > a:nth-child(n+4){border-top:1px solid var(--rule)}
.qh-art img.qimg{display:block; width:100%; height:auto}
.qg svg,.qg img.qimg{display:block; width:100%; height:auto; margin-bottom:12px; background:var(--bg)}
.qg .k{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:600}
.qg .q{font-family:var(--serif); font-size:clamp(21px,2.1vw,24px); line-height:1.2; margin:4px 0 8px; text-wrap:balance}
.qg .a{font-family:var(--serif); font-size:16px; line-height:1.45; color:var(--ink-2)}
.qg .a b{color:var(--ink); font-weight:600}
.qg .go{margin-top:auto; padding-top:10px; color:var(--brand); font-weight:600; font-size:15px}
.qg > a:hover .q{color:var(--brand)}
@media (max-width:900px){ .qg{grid-template-columns:repeat(2,minmax(0,1fr))} .qg > a{padding:18px 18px 20px!important; border-right:0; border-top:1px solid var(--rule)} .qg > a:nth-child(odd){padding-left:0!important; border-right:1px solid var(--rule)} .qg > a:nth-child(even){padding-right:0!important} }
@media (max-width:600px){ .qg{grid-template-columns:minmax(0,1fr)} .qg > a{padding:18px 0 20px!important; border-right:0!important} }
.ed-two{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px 48px; align-items:center}
@media (max-width:820px){ .ed-two{grid-template-columns:minmax(0,1fr)} }
.ed-lead{font-family:var(--serif); font-size:clamp(17.5px,1.9vw,20px); line-height:1.5; color:var(--ink-2)}
.ed-go{color:var(--brand); font-weight:600; text-decoration:none}
.ed-temas{display:flex; flex-wrap:wrap; gap:8px 30px; margin-top:10px}
.ed-temas a{font-family:var(--serif); font-size:clamp(20px,2.2vw,24px); text-decoration:none}
.ed-temas a small{font-family:var(--font); font-size:12px; color:var(--muted); margin-left:4px}
.ed-temas a:hover{color:var(--brand)}
.ed-multi{display:grid; grid-template-columns:1fr 1fr; gap:18px 20px}
.ed-multi svg{display:block; width:100%; height:auto}

/* animaciones: aparición al hacer scroll y pueblo al azar */
.qh-art{position:relative}
.spot{position:absolute; z-index:3; max-width:300px; background:#fff; border:1px solid var(--rule-2); box-shadow:0 6px 20px rgba(0,0,0,.08); padding:8px 11px; font-size:13px; line-height:1.4; color:var(--ink-2); text-decoration:none; transition:opacity .35s ease, left .35s ease, top .35s ease; pointer-events:auto}
.spot b{font-family:var(--serif); font-weight:600; font-size:15px; color:var(--ink)}
.spot span{color:var(--muted)}
.spot:hover{border-color:var(--brand)}
/* los dibujos aparecen completos, sin animación de entrada (la primera impresión manda) */
.rv{opacity:1}

/* Análisis: filtro por tema, buscador de municipio y panorama del tema */
.an-bar{display:flex; gap:14px 28px; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; border-bottom:1px solid var(--rule); padding-bottom:14px; margin:4px 0 18px}
.an-tabs{display:flex; gap:6px; flex-wrap:wrap}
.an-tabs a{border:1px solid var(--rule-2); border-radius:20px; padding:5px 14px; text-decoration:none; color:var(--ink-2); font-size:14.5px; background:var(--card)}
.an-tabs a:hover{border-color:var(--acc-ink); color:var(--ink)}
.an-tabs a[aria-current]{background:var(--ink); border-color:var(--ink); color:var(--bg); font-weight:700}
.an-mun{min-width:260px; flex:0 1 340px} .an-mun .bigsearch{margin-top:4px}
.an-pan{display:grid; grid-template-columns:200px minmax(0,1fr) auto; gap:18px; align-items:center; text-decoration:none; color:inherit; background:var(--band); border-radius:14px; padding:14px 18px; margin-bottom:10px}
.an-pan .img{height:70px} .an-pan .img svg{display:block; width:100%; height:100%}
.an-pan h3{font-size:21px; margin:2px 0 4px} .an-pan p{margin:0; color:var(--ink-2); font-size:14.5px} .an-pan .n{font-weight:800; color:var(--acc-ink)}
.an-pan:hover h3{text-decoration:underline}
.an-n{font-size:14px; margin:14px 0 4px}
.qg a[hidden]{display:none!important}
@media (max-width:720px){ .an-pan{grid-template-columns:1fr} .an-pan .img{display:none} .an-mun{flex-basis:100%} }
.an-mun .bigsearch input{padding:9px 12px 9px 36px!important; font-size:15.5px!important; border-width:1.5px!important}
.an-mun .bigsearch svg{left:12px!important}

/* Laboratorio: guía de entrada y pasos de «¿causa o casualidad?» */
.lbguide{background:var(--card); border:1px solid var(--rule); border-left:4px solid var(--acc-ink); border-radius:10px; padding:12px 16px; margin:-8px 0 18px}
.lbg-h{font-size:15px; color:var(--ink-2); line-height:1.5} .lbg-h b{color:var(--ink)}
.lbg-s{white-space:nowrap; color:var(--muted); font-size:13.5px}
.lbg-s i,.stp i,.czstep h3 i,.cz h3 i{display:inline-grid; place-items:center; width:20px; height:20px; border-radius:50%; background:var(--acc); color:var(--acc-ink); font-style:normal; font-weight:800; font-size:12px; margin:0 4px 0 6px; vertical-align:1px}
.stp i,.czstep h3 i,.cz h3 i{width:24px; height:24px; font-size:13px; margin:0 8px 0 0}
.lbg-q{margin-top:8px}
.stp{display:block; font-size:17px; margin-bottom:4px}
.czstep{margin-top:18px; padding-top:14px; border-top:1px solid var(--rule)}
.czstep h3{font-size:19px; margin:0 0 4px} .czstep>p{font-size:14.5px; margin:0 0 8px; max-width:720px}
.cz .czn{margin:14px 0 6px; font-size:15px}
.cz .tests{display:block; margin:0}
.cz .tests li{display:flex; gap:10px; align-items:flex-start; border:0; border-bottom:1px solid var(--rule); border-radius:0; background:none; padding:9px 2px; font-size:14.5px}
.cz .tests li:last-child{border-bottom:0}
.cz .tests li.na{color:var(--muted)}
.cz .tests li .em{font-size:16px; line-height:1.35}
.czmore{margin-top:14px; border-top:1px solid var(--rule); padding-top:10px}
.czmore summary{cursor:pointer; font-weight:700; font-size:14.5px}
.czwhy{margin:10px 0 0; font-size:14px; line-height:1.5}
.czwhy dt{font-weight:700; margin-top:10px} .czwhy dd{margin:2px 0 0 24px; color:var(--ink-2)}
.czwhy .czmini{margin-top:6px; max-width:240px}
@media (max-width:720px){ .lbguide{padding:10px 12px} .lbg-s{display:none} .lbg-q{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin-right:-12px; padding-right:12px} .lbg-q::-webkit-scrollbar{display:none} .lbg-q button{white-space:nowrap} }

/* Laboratorio: titular, acciones con icono y bloque compacto de causa o casualidad (2.ª versión) */
.lb-bar h2{font-size:clamp(21px,2.6vw,27px); line-height:1.2; max-width:640px}
.acts.ico{display:flex; gap:2px}
.acts.ico button{border:0!important; background:none!important; padding:6px!important; border-radius:8px; color:var(--ink-2); cursor:pointer; line-height:0}
.acts.ico button:hover{background:var(--band)!important; color:var(--ink)}
.acts.ico svg{fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; stroke-linecap:round}
.acts.ico #lbsave[aria-pressed="true"]{color:var(--acc-ink)} .acts.ico #lbsave[aria-pressed="true"] svg{fill:currentColor}
.labnav .lbsaved{margin-left:auto; border:0; background:none; font:inherit; font-size:14px; color:var(--muted); cursor:pointer; padding:2px 0}
.labnav .lbsaved:hover{color:var(--ink)}
.czc{display:grid; grid-template-columns:200px minmax(0,1fr); gap:24px; border-top:1px solid var(--ink); margin-top:20px; padding-top:16px}
.czc-l h3{font-size:22px; margin:0 0 8px; line-height:1.15}
.czc-l .dots{display:flex; gap:5px; margin-bottom:6px} .czc-l .dots i{width:14px; height:14px; border-radius:50%; border:1.5px solid var(--rule-2); background:none}
.czc-l .dots i.on{background:var(--ok); border-color:var(--ok)} .czc-l .dots.l0 i.on{background:var(--stone); border-color:var(--stone)} .czc-l .dots.l1 i.on{background:var(--mustard); border-color:var(--mustard)}
.czc-l em{display:block; font-family:var(--serif,inherit); font-size:17px} .czc-l small{color:var(--muted); font-size:13.5px}
.czc-q{font-size:17px; line-height:1.9; margin:0}
.czk{white-space:nowrap; font-weight:700; margin-right:10px; cursor:pointer} .czk input{accent-color:var(--ink); width:15px; height:15px; vertical-align:-2px}
.czk small{font-weight:400; color:var(--mustard); font-size:13px}
.czc .czbar{display:flex; align-items:center; gap:10px; margin:10px 0 4px; font-size:14px; background:none; border:0; padding:0}
.czbar .q{color:var(--ink-2)} .czbar .trk{flex:0 1 220px; height:8px; border-radius:4px; background:repeating-linear-gradient(90deg,var(--rule-2) 0 3px,transparent 3px 5px)}
.czbar .kp{display:block; height:100%; border-radius:4px; background:var(--ink); transition:width .5s}
.czbar .pc{color:var(--muted)} .czbar .pc b{color:var(--ink); font-size:15px}
.czc-s{font-size:15.5px; line-height:1.5; margin:8px 0 0; max-width:640px}
.czc-m{margin:12px 0 0; font-size:13.5px}
.lnk{border:0; background:none; padding:0; font:inherit; font-size:15px; font-weight:700; color:var(--acc-ink); cursor:pointer}
.lnk:hover{text-decoration:underline}
.czact{margin-top:12px; font-size:14px; color:var(--ink-2); display:flex; gap:6px; flex-wrap:wrap; align-items:center}
@media (max-width:720px){ .czc{grid-template-columns:1fr; gap:12px} .czc-q{font-size:16px} }
.czbar .pc{white-space:nowrap}

/* Ficha: dónde queda entre todos los municipios */
.strips{border-top:1px solid var(--ink); padding-top:12px}
.st-h{font-size:12px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); margin-bottom:6px}
.st-r{display:grid; grid-template-columns:200px minmax(0,1fr) 110px; gap:18px; align-items:center; padding:10px 0; border-bottom:1px solid var(--rule)}
.st-l{font-size:16px} .st-l small{display:block; font-size:12.5px; color:var(--muted); margin-top:2px}
.st-c canvas{display:block; width:100%; height:38px}
.st-x{display:flex; justify-content:space-between; font-size:11.5px; color:var(--muted); margin-top:2px}
.st-v{text-align:right; font-size:21px; color:var(--rust); font-variant-numeric:tabular-nums; font-family:var(--serif,inherit)}
.st-k{display:flex; gap:18px; flex-wrap:wrap; font-size:12.5px; color:var(--muted); margin-top:8px}
.st-k i{display:inline-block; width:3px; height:12px; background:var(--ink); vertical-align:-1px; margin-right:6px} .st-k i.me{background:var(--rust)}
@media (max-width:720px){ .st-r{grid-template-columns:minmax(0,1fr) auto; gap:4px 12px} .st-c{grid-column:1/-1; grid-row:2} }

/* Ilustraciones (illus/*.svg) */
.tcard .img:has(img){height:auto; padding:0; aspect-ratio:16/10} .tcard .img img,.an-pan .img img,.ed-ill img{display:block; width:100%; height:100%; object-fit:cover}
.an-pan .img:has(img){height:auto; aspect-ratio:16/10; border-radius:8px; overflow:hidden}
.ed-ill{display:block; background:var(--band); border-radius:16px; overflow:hidden; aspect-ratio:16/10}
.ed-ill.sm{max-width:320px; margin-top:18px; border-radius:12px}

/* Logotipo: «Indicio» en Fraunces, tinta, con el punto de la última i en granate */
.logo,.logo:hover{font-family:"Fraunces",var(--serif); font-weight:600; font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 0; font-size:29px; letter-spacing:-.025em; line-height:1; color:var(--ink); gap:0}
.logo .lg-i{position:relative; display:inline; width:auto; height:auto; padding:0; background:none; border-radius:0}
.logo .lg-i:after{content:""; position:absolute; left:50%; top:.3em; width:.165em; height:.165em; border-radius:50%; background:var(--brand-2); transform:translateX(-50%)}
@media (max-width:760px){ .logo{font-size:26px} }
/* sin buscador en la cabecera: el botón de tu municipio ocupa su sitio */
@media (max-width:760px){ .mymun{order:2; margin-left:auto; max-width:55%} }

/* Portada: eslogan, dos botones y un solo gráfico */
.qh-claim .qh-q{max-width:19ch}
.qh-claim .qh-a{min-height:0; max-width:700px}
.qh-cta{display:flex; gap:10px; flex-wrap:wrap; margin-top:22px}
.btn{display:inline-block; background:var(--ink); color:var(--bg); text-decoration:none; font-weight:700; font-size:15.5px; padding:11px 20px; border-radius:999px; border:1.5px solid var(--ink)}
.btn:hover{background:var(--brand); border-color:var(--brand); color:#fff}
.btn.alt{background:transparent; color:var(--ink)} .btn.alt:hover{background:var(--band); color:var(--ink); border-color:var(--ink)}
.qh-claim .qh-art{display:block; margin-top:34px}
.qh-claim .qh-cap{font-size:13.5px; color:var(--muted); margin-top:8px; font-style:italic; font-family:var(--serif)}
.qh-claim .qh-cap a{color:var(--brand); font-style:normal; font-family:var(--font); font-weight:600; text-decoration:none; white-space:nowrap}

/* Selector de datos del laboratorio: tema → dato */
.pick{display:flex; width:100%; align-items:center; justify-content:space-between; gap:8px; text-align:left; border:0; background:none; padding:2px 0; font:inherit; font-size:15px; font-weight:600; color:var(--ink); cursor:pointer}
.pick:after{content:"▾"; color:var(--muted); font-size:12px; margin-left:auto}
.pick .pv{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.pick .pg{flex:none; font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--acc-ink); background:var(--acc); border-radius:20px; padding:1px 8px}
.pick.add{font-weight:500; color:var(--muted)}
.dpick{position:fixed; z-index:60; width:430px; max-height:min(560px,calc(100vh - 16px)); display:flex; flex-direction:column; background:var(--card); border:1px solid var(--rule-2); border-radius:14px; box-shadow:0 18px 50px rgba(0,0,0,.18); overflow:hidden}
.dp-h{display:flex; gap:6px; padding:10px 10px 6px} .dp-h input{flex:1; min-width:0; border:1.5px solid var(--rule-2); border-radius:9px; padding:8px 11px; font:inherit; font-size:15px; background:var(--bg); color:var(--ink)} .dp-h input:focus{outline:0; border-color:var(--acc-ink)}
.dp-x{border:0; background:none; font-size:22px; line-height:1; color:var(--muted); cursor:pointer; padding:0 6px}
.dp-tabs{display:flex; gap:4px; overflow-x:auto; padding:2px 10px 8px; border-bottom:1px solid var(--rule); scrollbar-width:none} .dp-tabs::-webkit-scrollbar{display:none}
.dp-tabs button{flex:none; border:1px solid var(--rule-2); background:var(--bg); border-radius:20px; padding:4px 11px; font:inherit; font-size:13.5px; color:var(--ink-2); cursor:pointer; white-space:nowrap}
.dp-tabs button small{margin-left:5px; color:var(--muted); font-size:11.5px}
.dp-tabs button[aria-selected="true"]{background:var(--ink); border-color:var(--ink); color:var(--bg)} .dp-tabs button[aria-selected="true"] small{color:inherit; opacity:.7}
.dp-list{list-style:none; margin:0; padding:4px 6px 8px; overflow-y:auto; flex:1}
.dp-list button{display:block; width:100%; text-align:left; border:0; background:none; padding:8px 10px; border-radius:8px; font:inherit; cursor:pointer; color:var(--ink)}
.dp-list button:hover{background:var(--band)} .dp-list button.on{background:var(--acc)}
.dp-list b{display:block; font-size:15px; font-weight:600; line-height:1.3} .dp-list small{display:block; color:var(--muted); font-size:12px; margin-top:1px; line-height:1.35} .dp-list small i{font-style:normal; font-weight:700; color:var(--acc-ink)}
.dp-none{padding:14px 10px; color:var(--muted); font-size:14px}
@media (max-width:900px){ .dpick{left:0!important; right:0; top:auto!important; bottom:0; width:auto; max-height:78vh; border-radius:16px 16px 0 0; border-bottom:0} }
.slot .pick{color:var(--ink); font-size:15px; padding:2px 0; width:100%} .slot .pick.add{color:var(--muted)} .slot .pick .pg{color:var(--acc-ink)}

/* Menú de Análisis: panel con «Por tema» y «Por municipio» */
.navdd{display:inline-flex; align-items:center}
.navdd{border-radius:20px} .navdd:hover{background:rgba(0,0,0,.05)}
.navdd a,.navdd a:hover{padding-right:3px!important; background:none}
.navdd a[aria-current="page"]{background:var(--acc); border-radius:20px 0 0 20px}
.navdd .ddb,.navdd .ddb:hover{padding:4px 10px 4px 3px!important; background:none; font-size:12px; color:var(--muted)!important; line-height:1.6}
.navdd .ddb:after{content:"▾"; opacity:1}
.mega-wrap{position:absolute; top:100%; left:0; right:0; pointer-events:none; z-index:25}
.mega{display:none; pointer-events:auto; grid-template-columns:minmax(0,1.7fr) minmax(0,1fr); gap:6px 26px; width:min(820px,100%); background:var(--card); border:1px solid var(--rule-2); border-radius:0 0 14px 14px; box-shadow:0 22px 50px rgba(0,0,0,.16); padding:18px 20px 12px; margin-top:-1px}
.top.mega-open .mega{display:grid}
.mega-h{font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--acc-ink); margin:0 0 6px 10px}
.mega-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 8px}
.mega a{display:block; text-decoration:none; color:var(--ink); border-radius:8px; padding:8px 10px}
.mega a b{display:block; font-size:15.5px; font-weight:700} .mega a small{display:block; color:var(--muted); font-size:13px; line-height:1.35; margin-top:1px}
.mega a:hover,.mega a:focus-visible{background:var(--band)}
.mega-s{margin:0 0 4px 0!important; flex:none!important; max-width:none!important; width:100%} .mega-s input{width:100%; background:var(--bg)!important}
.mega-all{grid-column:1/-1; border-top:1px solid var(--rule); border-radius:0!important; margin-top:6px; padding:10px 10px 4px!important; font-weight:700; font-size:14.5px; color:var(--acc-ink)!important}
@media (max-width:760px){ .mega{width:100%; grid-template-columns:1fr; border-radius:0 0 14px 14px; max-height:calc(100vh - 110px); overflow-y:auto} .mega-grid{grid-template-columns:1fr} .navdd .ddb{padding:4px 10px 4px 2px!important} }

/* Análisis: entradas por tema y por municipio */
.an-sec{margin-top:34px} .an-sec .ed-h2{margin-top:2px}
.an-links{display:flex; gap:6px 20px; flex-wrap:wrap; margin:14px 0 0}
.an-h{font-size:22px; margin:30px 0 4px}
.an-else{display:flex; gap:10px 16px; align-items:baseline; flex-wrap:wrap; margin-top:34px; padding-top:14px; border-top:1px solid var(--rule)}
.an-otros{display:flex; gap:6px; flex-wrap:wrap} .an-otros a{border:1px solid var(--rule-2); border-radius:20px; padding:4px 13px; text-decoration:none; color:var(--ink-2); font-size:14.5px; background:var(--card)} .an-otros a:hover{border-color:var(--acc-ink); color:var(--ink)}
.an-vacio{color:var(--ink-2); margin:14px 0}
