/* TrailLab v291 · tema claro, tercera pasada: la TARJETA BASE de la app
   ==========================================================================================
   Oli: «repasa el tema claro porque sigue igual y eso que te dejé los pantallazos.» Y tenía razón:
   la captura enseña los récords, «🏅 Mejores tiempos» y el perfil de etapa de Estadísticas con el
   texto ilegible, exactamente igual que antes de v290.

   POR QUÉ v273 Y v290 NO LO ARREGLARON, Y POR QUÉ ES LA MISMA HISTORIA UNA TERCERA VEZ
   -----------------------------------------------------------------------------------
   Las dos versiones anteriores fueron a por las hojas: `.ach-metrics-v221`, `.summit-passport`,
   `.pro-compare-card`, `.rp-tile`… paneles concretos, nombrados uno a uno a partir de capturas.
   Ninguna de las dos tocó la regla que pinta de oscuro **casi todas las tarjetas de la app**:

       [data-visual-system="v221"] .estado-block,
       [data-visual-system="v221"] .card,
       [data-visual-system="v221"] .st-card{ background:linear-gradient(145deg,rgba(16,39,46,.96),…) }

   `assets/trail-lab-v221.css:349`. Y `data-visual-system="v221"` no es de una pantalla suelta: lo
   estampa `polishViewV221()` (`assets/trail-lab-v221.js:1143`) sobre **la raíz de cada vista que se
   activa**, así que en cuanto navegas está en todas. O sea que el tema claro nunca ha cubierto la
   pieza más repetida del producto — y por eso «arreglar los ejemplos de la captura» dejaba siempre
   otra pantalla rota: las capturas enseñaban hojas de un árbol que nadie había mirado.

   Esto no se arregla mirando más capturas. La lista de abajo sale de **barrer todo el CSS del
   proyecto** —`index.html` y `assets/*.css`— buscando reglas cuyo `background` lleve un color
   oscuro escrito a mano (luminancia < 90, alfa ≥ .45): 86 reglas, de las que éstas son las que
   contienen texto. Las de pura decoración (velos, pistas de barras de progreso, campos de
   formulario, botones de cerrar) quedan fuera a propósito, y los reproductores en directo
   (`.tll-*`, `.tls-*`) también: v273 los resolvió con criterio propio y funcionan.

   CÓMO SE ARREGLA: IGUAL QUE v290, PORQUE EL MÉTODO ES BUENO
   ---------------------------------------------------------
   Un panel de fondo oscuro es una **isla de tema oscuro** dentro de una página clara. Se le
   devuelve la paleta oscura dentro y todos sus hijos —los de hoy y los que alguien añada mañana—
   heredan lo correcto sin nombrarlos. Los fondos NO se aclaran: son de acento a propósito.

   Con la tarjeta base cubierta, esta regla deja de ser una lista que crece cada versión: cualquier
   tarjeta nueva de la app nace dentro de `.card` o `.st-card` y nace bien.

   Fichero nuevo, y no un añadido a v290, por lo mismo que v290 no se añadió a v273: estos estáticos
   van cache-first y su nombre no cambia entre versiones. Va cargado DESPUÉS de v290. */

/* ============================================================ LA TARJETA BASE DE LA APP
   Ésta es la regla que faltaba. Cubre Estadísticas entera (los récords, «Mejores tiempos», el
   perfil de etapa de la captura de Oli), Estado, Forma, Resumen y cualquier pantalla futura. */
[data-theme="light"] [data-visual-system="v221"] .card,
[data-theme="light"] [data-visual-system="v221"] .st-card,
[data-theme="light"] [data-visual-system="v221"] .estado-block,
[data-theme="light"] [data-visual-system="v221"] .ef-card,
[data-theme="light"] [data-analytics-release="v221"] .tl-chart-card,

/* ------------------------------------------------------------ piezas oscuras dentro de las vistas */
[data-theme="light"] #view-estado .foco-bar,
[data-theme="light"] #view-estadisticas .st-chip,
[data-theme="light"] #view-estado .st-chip,
[data-theme="light"] #view-forma .st-chip,
[data-theme="light"] .tl-chart-card .pf-tip,
[data-theme="light"] .tl-chart-card .bc-tip,
[data-theme="light"] .tl-chart-card .cmp-tip,
[data-theme="light"] #accountShield,
[data-theme="light"] .account-shield-card,
[data-theme="light"] .mn-hero,
[data-theme="light"] .mu-cell .frame,
[data-theme="light"] .routes-map-badge,
[data-theme="light"] #tourTip,

/* ------------------------------------------------------------------------- progreso y logros */
[data-theme="light"] .prog-root,
[data-theme="light"] .prog-be,
[data-theme="light"] .prog-circ,
[data-theme="light"] .prog-pts,
[data-theme="light"] .prog-link,
[data-theme="light"] .achv-qnav,
[data-theme="light"] .achv-modal,
[data-theme="light"] .achv-modal-x,
[data-theme="light"] .achv-flip-action,
[data-theme="light"] .achv-flip-front,
[data-theme="light"] .achv-flip-back,
[data-theme="light"] .achv-unlock,
[data-theme="light"] .achv-u-box,

/* --------------------------------------------------------------------------- amigos y equipo */
[data-theme="light"] .amc-sky,
[data-theme="light"] .amc-gem,
[data-theme="light"] .amc-rate,
[data-theme="light"] .amc-badge.b-foaf,
[data-theme="light"] .eq-node.empty,
[data-theme="light"] .eq-thumb,
[data-theme="light"] .wc-logo,

/* ------------------------------------------------------------------- cimas: las tres colecciones */
[data-theme="light"] .summit-card-no,
[data-theme="light"] .summit-card-state,
[data-theme="light"] .summit-card-art,
[data-theme="light"] .summit-detail-art,
[data-theme="light"] .summit-detail-number,
[data-theme="light"] .summit-detail-badge,
[data-theme="light"] .world-summit-state,
[data-theme="light"] .summit-v227-art>span,
[data-theme="light"] .europe-summit-card.is-crowned .europe-summit-state,
[data-theme="light"] .europe-detail-art span,
[data-theme="light"] .cimas-hero-v392,
[data-theme="light"] .cimas-go-logros-v392,
[data-theme="light"] .cimas-go-logros-v392:hover,

/* ----------------------------------------------------------- asistente de Conexiones v390 */
[data-theme="light"] #view-conexiones .conn-v278 .cx-step,
[data-theme="light"] #view-conexiones .conn-v278 .cx-step[open],
[data-theme="light"] #view-conexiones .conn-v278 .cx-step-no,
[data-theme="light"] #view-conexiones .conn-v278 .cx-step-body,
[data-theme="light"] #view-conexiones .conn-v278 .cx-step-list li::before,

/* ------------------------------------------------------------------------- perfil de elevación */
[data-theme="light"] .elev-v232,
[data-theme="light"] .ep-tooltip {
  /* Paleta del tema oscuro, restringida a este subárbol. Misma que v290 a propósito: si algún día
     cambia el tema oscuro, las dos islas tienen que moverse juntas. */
  --ink: #eaf7f2;
  --muted: rgba(234, 247, 242, .72);
  --line: rgba(255, 255, 255, .14);
  --surface: rgba(255, 255, 255, .05);
  --surface2: rgba(255, 255, 255, .08);
  --tl-text: #eaf7f2;
  --tl-text-2: rgba(234, 247, 242, .78);
  --tl-text-3: rgba(234, 247, 242, .56);
  --tl-border: rgba(255, 255, 255, .13);
  --tl-border-strong: rgba(255, 255, 255, .22);
  --tl-panel: rgba(255, 255, 255, .04);
  --tl-panel-soft: rgba(255, 255, 255, .05);
  --tl-panel-raised: rgba(255, 255, 255, .08);
  --tl-canvas: rgba(0, 0, 0, .16);
  --lime: #a6e82c;
  --lime2: #7dbb1f;
  --tl-soft: rgba(255, 255, 255, .05);
  --tl-soft2: rgba(255, 255, 255, .09);
  --tl-track: rgba(255, 255, 255, .12);

  color: var(--ink);
}

/* ==================================================== lo que NO hace falta nombrar, y por qué
   Se comprobó uno a uno lo que hay dentro de la tarjeta base antes de escribir esta sección, y
   la conclusión es que está vacía a propósito: `.st-head h3` no declara color y hereda; `.st-sub`,
   `.st-note` y `.sd-stat .l` van con `var(--muted)`; `.bt-table td` hereda y su columna de tiempos
   usa `var(--cyan)`. Todo eso lo arregla la isla de arriba **sin tocarlo**, que es justo la prueba
   de que el método es el correcto. La única excepción es `#view-estadisticas .st-card.tl-chart-card
   .st-sub{color:#8ba99e}`, escrito a mano — pero es un gris claro y sobre el fondo oscuro, que no
   se toca, se lee bien. Repintarlo aquí sería añadir una línea que no arregla nada y que habría
   que mantener. */

/* --------------------------------------------------------------- gráficas dentro de las islas */
/* Mismo criterio que v290: los textos de los SVG se pintan con `fill`, que no hereda de `color`. */
[data-theme="light"] [data-visual-system="v221"] .st-card text,
[data-theme="light"] [data-visual-system="v221"] .card text,
[data-theme="light"] [data-analytics-release="v221"] .tl-chart-card text,
[data-theme="light"] .elev-v232 text {
  fill: var(--tl-text-3);
}
