/* Estilos propios del tablero de 13 ciudades */
.hero-author2 { display:block; margin-top:10px; }

.twolevel { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.tl-card { border:1px solid var(--line); border-left:6px solid var(--brand); border-radius:14px; padding:18px 20px; position:relative; }
.tl-card .tl-n { position:absolute; top:14px; right:16px; font-size:34px; font-weight:900; color:var(--purple-soft); }
.tl-card h3 { margin:0 0 6px; color:var(--brand); }
.tl-card p { margin:0; line-height:1.45; }

.city-tiers { display:grid; gap:16px; }
.tier-group { border:1px solid var(--line); border-left:6px solid var(--seg); border-radius:14px; padding:14px 16px; }
.tier-head { display:flex; align-items:center; gap:10px; margin-bottom:10px; font-size:1.05rem; }
.tier-head b { color:var(--brand); } .tier-head span:last-child { margin-left:auto; color:var(--muted); font-size:.85rem; font-weight:700; }
.tier-cities { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; }
.city-chip { text-align:left; border:1px solid var(--line); border-radius:10px; padding:10px 12px; background:#fff; cursor:pointer; transition:.15s; }
.city-chip:hover { border-color:var(--brand); }
.city-chip.active { border-color:var(--brand); box-shadow:inset 0 0 0 2px var(--brand); }
.city-chip b { display:block; color:var(--ink); } .city-chip span { font-size:.8rem; color:var(--muted); }

.city-head { border-left:5px solid var(--seg); padding-left:12px; margin-bottom:12px; }
.city-head h3 { margin:4px 0 2px; }
.city-head p { margin:0; font-size:.9rem; }
.tier-badge { display:inline-block; color:#fff; font-weight:800; font-size:.78rem; border-radius:999px; padding:3px 12px; }

.line-card ul.mini { margin:8px 0 0; padding-left:18px; } .line-card ul.mini li { font-size:.85rem; line-height:1.35; }
.seg-rank { font-weight:700; font-size:.85rem; }

@media (max-width:860px){ .twolevel { grid-template-columns:1fr; } }

/* checkbox de puestos en los controles */
.controls label.chk { display:flex; align-items:center; gap:7px; cursor:pointer; font-weight:700; }
.controls label.chk input { width:16px; height:16px; accent-color:#2746e6; cursor:pointer; }
.controls label.chk span { font-size:.9rem; }

/* Leyenda de puestos (rendimiento) */
.puesto-legend { display:flex; flex-wrap:wrap; gap:6px 16px; align-items:center; padding:10px 12px; margin-top:8px;
  background:#f7f8fb; border:1px solid #e2e5ee; border-radius:10px; }
.puesto-legend .pl-title { font-weight:800; font-size:.82rem; color:#2a2152; width:100%; }
.puesto-legend .pl-item { font-size:.78rem; color:#4b5563; display:flex; align-items:center; gap:5px; max-width:30%; }
.puesto-legend .pl-dot { width:11px; height:11px; border-radius:50%; flex:none; border:1px solid #fff; box-shadow:0 0 0 1px #ccc; }
@media (max-width:860px){ .puesto-legend .pl-item { max-width:100%; } }

/* Panel Voto y perfil */
.voto-grid { display:grid; gap:16px; }
.voto-block h4 { margin:0 0 8px; font-size:.92rem; color:#2a2152; }
.voto-block h4 small { font-weight:600; color:#6b7280; }
.vbar { display:grid; grid-template-columns:150px 1fr 92px; align-items:center; gap:8px; margin:4px 0; }
.vbar-l { font-size:.8rem; color:#374151; }
.vbar-track { background:#eceef4; border-radius:6px; height:11px; overflow:hidden; }
.vbar-track i { display:block; height:100%; border-radius:6px; }
.vbar-v { font-size:.82rem; font-weight:800; color:#2a2152; text-align:right; }
.vbar-v small { font-weight:600; color:#9aa3b2; }
.vsmall { font-size:.78rem; margin:8px 0 0; line-height:1.4; }

/* Panel Prioridades */
.prio-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.prio-col h4 { margin:0 0 2px; font-size:.92rem; color:#2a2152; }
.prio-item { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:6px 0; border-bottom:1px solid #eef0f5; }
.prio-item > span:first-child { display:flex; flex-direction:column; }
.prio-item small { color:#9aa3b2; font-size:.72rem; }
.prio-m { text-align:right; display:flex; flex-direction:column; font-size:.82rem; color:#2a2152; }
.prio-m small { color:#9aa3b2; font-weight:600; }
@media (max-width:860px){ .vbar { grid-template-columns:120px 1fr 80px; } .prio-grid { grid-template-columns:1fr; } }

/* nivel puesto (ciudades finas) */
.fino-badge { display:inline-block; background:#1f9e57; color:#fff; font-weight:800; font-size:.72rem;
  border-radius:999px; padding:2px 9px; margin-left:6px; }
.metric-fino { box-shadow:inset 0 0 0 2px #1f9e57; }
.puesto-legend .pl-sub { width:100%; font-size:.78rem; color:#374151; margin:-2px 0 2px; }

.legend .lg-note { color:#9aa3b2; font-size:.72rem; font-style:italic; }

/* Perfil por comuna (clic en el mapa) */
.prof-head { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; padding-bottom:8px; border-bottom:1px solid #eef0f5; font-size:.95rem; }
.prof-tag { background:#2a2152; color:#fff; font-weight:800; font-size:.7rem; border-radius:999px; padding:2px 9px; text-transform:uppercase; letter-spacing:.03em; }
.prof-head small { color:#9aa3b2; font-weight:600; }
.prof-reset { margin-left:auto; background:#eef0fb; color:#2746e6; border:0; border-radius:7px; padding:5px 11px; font-weight:800; font-size:.78rem; cursor:pointer; }
.prof-reset:hover { background:#dfe4f8; }