/* COT · score por activo. Tarjetas alineadas (misma altura por fila), sin desbordes; entrada escalonada solo con movimiento permitido; sin animaciones infinitas ni backdrop-filter. */
.cs-intro { margin: 4px 0 12px; font-size: 12.5px; line-height: 1.5; }
.cs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 10px; align-items: stretch; }
.cs-card { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 12px; border: 1px solid var(--t-borde-suave, rgba(255,255,255,.08)); border-radius: 12px; background: var(--t-panel, #131314); }
.cs-cab { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; } .cs-cab b { font-size: 16px; } .cs-nom { font-size: 12px; color: var(--text-muted); flex: 1; min-width: 0; }
.cs-etq { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--t-borde, rgba(255,255,255,.18)); color: var(--text-secondary); white-space: nowrap; }
.cs-etq { white-space: normal; text-align: right; }                    /* la etiqueta describe el rango, no el signo: sin verde/rojo */
.cs-signo { font-size: 12.5px; font-weight: 600; color: var(--text-secondary); } .cs-aviso { display: block; margin-top: 2px; }
.cs-score { display: flex; align-items: baseline; gap: 4px; } .cs-n { font-size: 30px; font-weight: 600; letter-spacing: -.02em; line-height: 1.1; } .cs-score small { color: var(--text-muted); }
.cs-term { position: relative; display: flex; height: 10px; border-radius: 999px; overflow: visible; gap: 2px; }
.cs-z { height: 100%; opacity: .8; } .cs-z:first-child { border-radius: 999px 0 0 999px; } .cs-z:nth-child(5) { border-radius: 0 999px 999px 0; }
.cs-z-xc { background: color-mix(in srgb, var(--t-naranja, #ff7a2e) 25%, var(--text-muted)); } .cs-z-c { background: color-mix(in srgb, var(--t-naranja, #ff7a2e) 15%, var(--text-muted)); } .cs-z-n { background: var(--text-muted); } .cs-z-l { background: color-mix(in srgb, var(--t-naranja, #ff7a2e) 15%, var(--text-muted)); } .cs-z-xl { background: color-mix(in srgb, var(--t-naranja, #ff7a2e) 25%, var(--text-muted)); }
.cs-marca { position: absolute; top: 50%; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: var(--text-primary); border: 2px solid var(--t-panel, #131314); transform: translateY(-50%); }
.cs-esc { display: flex; justify-content: space-between; font-size: 12px; color: var(--text-muted); margin-top: -2px; }
.cs-datos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 4px 0 0; } .cs-datos div { min-width: 0; } .cs-datos dt { font-size: 12px; color: var(--text-muted); } .cs-datos dd { margin: 0; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; } .cs-datos small { font-weight: 400; color: var(--text-muted); }
.cs-spark { width: 100%; height: 28px; display: block; } .cs-cero { stroke: var(--text-muted); stroke-width: .6; stroke-dasharray: 2 2; }
.cs-txt { margin: auto 0 0; font-size: 12.5px; line-height: 1.5; color: var(--text-secondary); }
.cs-nota { margin: 10px 0 0; font-size: 12px; }
@media (max-width: 420px) { .cs-datos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (prefers-reduced-motion: no-preference) {
  html:not([data-efectos="off"]) .cs-card { animation: cs-entra .35s ease both; animation-delay: calc(var(--i, 0) * 45ms); }
  html:not([data-efectos="off"]) .cs-marca { animation: cs-marca .6s cubic-bezier(.2,.8,.2,1) both; animation-delay: calc(var(--i, 0) * 45ms + 120ms); }
}
@keyframes cs-entra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes cs-marca { from { opacity: 0; transform: translateY(-50%) scale(.3); } to { opacity: 1; transform: translateY(-50%) scale(1); } }
/* «?» de la cabecera del COT: zona táctil de 28 px sin la ampliación invisible (evitaba desbordes a 360 px) */
#sem-cot .panel-cab .gl-q { width: 28px; height: 28px; min-width: 28px; min-height: 28px; padding: 0; overflow: hidden; }
#sem-cot .panel-cab .gl-q::after { display: none; }

/* ESCALA TIPOGRÁFICA ÚNICA del COT (29/10/2026). Causa del tamaño desigual: la tarjeta llevaba la clase de su nivel «cs-n» (zona media) y `.cs-n` es también el tamaño de la cifra (30 px):
   ES, GBP/USD y Oro (nivel «Media») heredaban 30 px en todo su texto. Ahora el modificador es `cs-nv-*` y cada elemento usa una variable fija, sin depender del contenido. */
:root { --cot-t-titulo: 16px; --cot-t-cifra: clamp(24px, 7vw, 28px); --cot-t-etq: 12px; --cot-t-apoyo: 13.5px; --cot-t-dt: 12px; --cot-t-dd: 13px; }
#sem-cot .cs-card .cs-cab b { font-size: var(--cot-t-titulo); }
#sem-cot .cs-card .cs-n { font-size: var(--cot-t-cifra); font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1.1; }
#sem-cot .cs-card .cs-etq { font-size: var(--cot-t-etq); }
#sem-cot .cs-card .cs-signo, #sem-cot .cs-card .cs-nom { font-size: var(--cot-t-apoyo); }
#sem-cot .cs-card .cs-datos dt { font-size: var(--cot-t-dt); }
#sem-cot .cs-card .cs-datos dd { font-size: var(--cot-t-dd) !important; font-variant-numeric: tabular-nums; overflow-wrap: normal; line-height: 1.3; }
#sem-cot .cs-card .cs-datos dd.num { white-space: nowrap; } #sem-cot .cs-card .cs-datos dd small { display: block; font-size: var(--cot-t-dt); font-weight: 400; white-space: normal; color: var(--text-muted); }
#sem-cot .cs-card .cs-txt, #sem-cot .cs-card .cs-que p { font-size: var(--cot-t-apoyo) !important; line-height: 1.5; }
#sem-cot .cs-card .cs-que summary { font-size: var(--cot-t-apoyo); }
.cs-que { margin-top: 6px; border-top: 1px solid var(--t-borde-suave, rgba(255,255,255,.08)); padding-top: 6px; }
.cs-que summary { cursor: pointer; font-weight: 600; color: var(--text-secondary); min-height: 32px; display: flex; align-items: center; }
.cs-que-in { display: grid; gap: 8px; padding: 4px 0 2px; } .cs-que-in p { margin: 0; color: var(--text-secondary); } .cs-que-in b { display: block; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); font-weight: 600; margin-bottom: 1px; }
.cs-que-in .cs-que-def, .cs-que-in .cs-que-aviso { color: var(--text-muted); }
.cs-intro .gl-q { vertical-align: middle; }

/* E · COT legible (04/11/2026): una columna por activo en móvil, dos en escritorio (ninguna de menos de 280 px útiles), «¿Qué significa?» a ancho completo, sin texto vertical. */
.cs-grid { grid-template-columns: 1fr; }
@media (min-width: 900px) { .cs-grid { grid-template-columns: repeat(2, minmax(280px, 1fr)); } }
.cs-card, .cs-card * { writing-mode: horizontal-tb; }
.cs-card details, .cs-card .cs-sig, .cs-card .cs-expl { width: 100%; }
.cs-card p, .cs-card li { overflow-wrap: break-word; word-break: normal; font-size: 13.5px; line-height: 1.45; }
