/* tta-palabras.css — «Visual antes que texto» (24-sep-2026, §8F). Estilos de la capa
   tta-palabras.js: el «?» que guarda las explicaciones, las cifras grandes de la Ruta por
   niveles, las fichas de «cómo sumar puntos» y los candados como iconos. Prefijo ttp. */
.ttp-q{display:inline-grid;place-items:center;width:22px;height:22px;margin-left:6px;padding:0;border-radius:50%;border:1px solid var(--ln,var(--border-primary,rgba(255,255,255,.16)));background:transparent;color:var(--t3,var(--text-muted,#9a9a9a));font-family:inherit;font-size:12px;font-weight:700;line-height:1;cursor:pointer;vertical-align:middle;flex:0 0 auto}
.ttp-q:hover,.ttp-q:focus-visible{background:rgba(255,255,255,.07);color:var(--t2,var(--text-secondary,#ddd));outline:none}
.ttp-pop{position:fixed;z-index:9999;max-width:min(340px,calc(100vw - 16px));padding:10px 12px;border-radius:12px;background:var(--s1,var(--surface-2,#1a1a1e));border:1px solid var(--ln,var(--border-primary,rgba(255,255,255,.12)));box-shadow:0 12px 32px rgba(0,0,0,.45);color:var(--t2,var(--text-secondary,#ddd));font-size:var(--tta-text-body,14px);line-height:1.45}

/* Ruta por niveles: cifras grandes en vez de una frase */
.ttp-stats{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 14px}
.ttp-stat{display:flex;flex-direction:column;align-items:center;min-width:92px;padding:10px 14px;border:1px solid var(--ln,var(--border-primary,rgba(255,255,255,.1)));border-radius:14px;background:var(--s1,var(--surface-2,rgba(255,255,255,.03)))}
.ttp-stat b{font-size:var(--tta-text-hero,26px);line-height:1;font-weight:800;color:var(--gold,#D4AF37)}
.ttp-stat span{display:inline-flex;gap:4px;align-items:center;margin-top:6px;font-size:var(--tta-text-meta,12px);color:var(--t3,var(--text-muted,#9a9a9a));text-transform:uppercase;letter-spacing:.05em}
.ttp-stat span .material-symbols-outlined{font-size:15px}
.ttp-fichas{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px;align-items:stretch;margin:14px 0 6px}
.ttp-ficha{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;border:1px solid var(--ln,var(--border-primary,rgba(255,255,255,.1)));border-radius:14px;background:var(--s1,var(--surface-2,rgba(255,255,255,.03)));text-align:center}
.ttp-ficha .material-symbols-outlined{font-size:26px;color:var(--gold,#D4AF37)}
.ttp-ficha b{font-size:var(--tta-text-title,19px);font-weight:800;line-height:1}
.ttp-ficha span{font-size:var(--tta-text-meta,12px);color:var(--t2,var(--text-secondary,#ccc))}
.ttp-fichas>.ttp-q{align-self:center;justify-self:start}
.ttp-nivel{display:inline-flex;gap:4px;align-items:center}
.ttp-nivel .material-symbols-outlined{font-size:15px}

/* Candados: un icono por condición en el chip del máster */
.tg-estado .ttp-cand{display:inline-flex;gap:3px;align-items:center;margin-right:8px}
.tg-estado .ttp-cand .material-symbols-outlined{font-size:16px}
.tta-gate h3 .ttp-q{vertical-align:middle}

/* El chip del candado en la primera fila de la sección, a la derecha (Señales, Miembros, Calendario) */
.ttp-fila{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}
.ttp-fila>.tg-barra{margin:0 0 0 auto;flex:0 0 auto}
.ttp-fila>.sn-rangos,.ttp-fila>.tta-mstats{flex:1 1 auto;min-width:0}
#panel-calendar .ttp-fila{justify-content:space-between}
.tta-calendar-header[data-tg-host]{flex-wrap:wrap;gap:8px}
.tta-calendar-header>.tg-barra{margin:0 0 0 auto;flex:0 0 auto}
.tg-barra .btn.ttp-solo-icono{padding:0 9px;min-width:34px}
.tg-barra .ttp-oculto{display:none}

/* Hoja «¿Qué quieres publicar?» fuera de la comunidad: la frase de cada opción va en title ([hidden] pierde contra la demo) */
#sheet-in .cr .opc .ttp-oculto{display:none}

/* Live: el «?» al lado del título de cada sección y del QR */
.lv-h .ttp-q,#lv-qrbox .ttp-q,#st-ph1 .ttp-q{margin-left:8px}
