/**
 * TORACLES CANDIDATE2 — Capa base de estilos (Fase C2-2).
 *
 * Fuente canónica: canonical/TORACLES_CANDIDATE2/source/TORACLES Home v2.dc.html
 *   SHA256 consolidado (C2-0): aa024346ab076ee3a9cca61dc151aca2131143a6c3b0f1a949227026f93b165c
 * Tokens: docs/migration/TORACLES_CANDIDATE2_TOKENS.md (sección 8, propuesta --c2-*).
 * Estructura: docs/migration/TORACLES_CANDIDATE2_SECTION_MAP.md (sección 8, estructura de archivos).
 *
 * REGLAS DE ESTA CAPA:
 * 1. Todo selector está scopeado bajo .toracles-candidate2 (wrapper con
 *    data-toracles-candidate="2"). Nada de esto afecta a CANDIDATE1.
 * 2. Este archivo NO se encola todavía: sin capa de enqueue (inc/candidate2.php)
 *    no tiene ningún efecto en el sitio. CANDIDATE2 no está activo como home.
 * 3. Los estados hover del canon (atributos propietarios de la fuente) se
 *    resuelven aquí como :hover / .is-active reales.
 * 4. Keyframes canónicos: tickerScroll, haloPulse, sweep, blink (nombres exactos
 *    del canon; verificados sin colisión con theme.css/sections.css).
 * 5. @media (prefers-reduced-motion: reduce) neutraliza las cuatro animaciones
 *    y todas las transiciones (condición obligatoria de la auditoría C2-1).
 * 6. Sin atributos propietarios ni interpolaciones del runtime original de la
 *    fuente dc: sólo existe CSS estándar, apto para el criterio de no
 *    aceptación de C2-7.
 *
 * Convención de nombres: el wrapper usa .toracles-candidate2 (contrato del
 * section map y de verify-candidate2); los descendientes usan prefijo corto
 * c2- porque el scope del wrapper ya garantiza unicidad.
 *
 * SECCIÓN 18 (Fase C2-4): componentes por sección diferidos por C2-2
 * (ver TORACLES_CANDIDATE2_C2-2_CSS.md, "Pendientes de fases posteriores"):
 * prosa de portada/manifiesto, cuerpos de card con media superior, cajas
 * publicitarias, tabla de mercado, tarjetas de color y formulario del
 * boletín. Mismas reglas 1-6 de arriba; valores de canon no tokenizados
 * por C2-2 se escriben como literales rgba() con su línea de referencia.
 */

@font-face {
  font-family: "Source Serif 4";
  src: url("./fonts/source-serif-4-0.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Toracles Fell";
  src: url("./fonts/im-fell-english-0.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Toracles Mono";
  src: url("./fonts/ibm-plex-mono-0.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   1. Variables canónicas --c2-*
   Basadas en TORACLES_CANDIDATE2_TOKENS.md §8; las adiciones propias de esta
   capa (spacing de sección, divisores reutilizados) están marcadas como tales.
   ========================================================================== */
.toracles-candidate2 {
  /* --- Fondos y superficies --- */
  --c2-bg-canvas: #0a0a0c;
  --c2-bg-section-dark: #08080a;
  --c2-bg-section-card: #0d0d10;
  --c2-bg-card-hover: #131318;
  --c2-bg-header-glass: rgba(10, 10, 12, 0.9);
  --c2-bg-readout: rgba(13, 13, 16, 0.9);
  --c2-bg-input: rgba(13, 13, 16, 0.85);
  --c2-bg-strip: rgba(8, 8, 10, 0.72);
  --c2-bg-card-inactive: rgba(10, 10, 12, 0.7);
  --c2-bg-ad-slot: rgba(205, 176, 122, 0.03);

  /* --- Oro de marca (Toracles Gold) --- */
  --c2-gold-base: #cdb07a;
  --c2-gold-light: #f0e2c0;
  --c2-gold-border: rgba(205, 176, 122, 0.16);
  --c2-gold-border-subtle: rgba(205, 176, 122, 0.09);
  --c2-gold-border-strong: rgba(205, 176, 122, 0.35);
  --c2-gold-grid: rgba(205, 176, 122, 0.045);
  --c2-gold-pattern: rgba(205, 176, 122, 0.09);
  --c2-gold-sweep: rgba(205, 176, 122, 0.12);
  --c2-gold-halo: rgba(205, 176, 122, 0.55);
  /* Adiciones C2-2: bordes/reglas doradas reutilizadas en varios componentes */
  --c2-gold-border-soft: rgba(205, 176, 122, 0.18);
  --c2-gold-rule: rgba(205, 176, 122, 0.2);
  --c2-gold-rule-strong: rgba(205, 176, 122, 0.5);
  --c2-gold-divider-column: rgba(205, 176, 122, 0.12);
  --c2-gold-border-input: rgba(205, 176, 122, 0.32);
  --c2-gold-border-emphasis: rgba(205, 176, 122, 0.42);
  --c2-gold-border-dashed: rgba(205, 176, 122, 0.26);

  /* --- Tipografía y jerarquía de color --- */
  --c2-text-heading: #f6efe0;
  --c2-text-brand: #f3ead6;
  --c2-text-card-h3: #f0ebde;
  --c2-text-highlight: #f0e2c0;
  --c2-text-body: #e7e2d6;
  /* Escala muted derivada de #e7e2d6 (tokens §2.3) */
  --c2-text-muted-84: rgba(231, 226, 214, 0.84);
  --c2-text-muted-72: rgba(231, 226, 214, 0.72);
  --c2-text-muted-70: rgba(231, 226, 214, 0.70);
  --c2-text-muted-68: rgba(231, 226, 214, 0.68);
  --c2-text-muted-66: rgba(231, 226, 214, 0.66);
  --c2-text-muted-62: rgba(231, 226, 214, 0.62);
  --c2-text-muted-60: rgba(231, 226, 214, 0.60);
  --c2-text-muted-58: rgba(231, 226, 214, 0.58);
  --c2-text-muted-56: rgba(231, 226, 214, 0.56);
  --c2-text-muted-55: rgba(231, 226, 214, 0.55);
  --c2-text-muted-52: rgba(231, 226, 214, 0.52);
  --c2-text-muted-50: rgba(231, 226, 214, 0.50);

  /* --- Acentos semánticos y WUBRG --- */
  --c2-color-red: #c9564a;
  --c2-color-red-glow: rgba(201, 86, 74, 0.32);
  --c2-color-red-bg: rgba(201, 86, 74, 0.13);
  --c2-color-red-shadow: rgba(201, 86, 74, 0.6);
  --c2-color-blue: #7fa8d8;
  --c2-color-blue-glow: rgba(127, 168, 216, 0.32);
  --c2-color-green: #7ec08e;
  --c2-color-green-glow: rgba(126, 192, 142, 0.32);
  --c2-color-white: #eee2bd;
  --c2-color-white-glow: rgba(238, 226, 189, 0.32);
  --c2-color-black: #9a86b8;
  --c2-color-black-glow: rgba(154, 134, 184, 0.32);
  --c2-color-ambient-cool: rgba(80, 110, 180, 0.14);

  /* --- Familias tipográficas ---
     La carga real de fuentes (Google vs self-host) es decisión pendiente nº7
     y vive en la capa de enqueue, no aquí. Se declaran los nombres canónicos
     del canon con fallbacks robustos. */
  --c2-font-display: "Instrument Serif", "Toracles Fell", Georgia, serif;
  --c2-font-body: "Source Serif 4", Georgia, "Times New Roman", serif;
  --c2-font-mono: "Toracles Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* --- Dimensiones y spacing (tokens §5) --- */
  --c2-max-width-site: 1300px;
  --c2-max-width-manifesto: 1000px;
  --c2-pad-x: clamp(16px, 3.5vw, 44px);
  /* Adiciones C2-2: paddings verticales por sección (tokens §5.3) */
  --c2-section-pad: clamp(38px, 4.6vw, 68px);
  --c2-section-pad-hero-top: clamp(56px, 8vw, 120px);
  --c2-section-pad-hero-bottom: clamp(40px, 5vw, 72px);
  --c2-section-pad-tall: clamp(42px, 5.2vw, 80px);
  --c2-section-pad-cta: clamp(46px, 5.6vw, 86px);
  --c2-ticker-height: 32px;
  --c2-header-min-height: 68px;
  --c2-border-radius-btn: 1px;
  --c2-border-radius-circle: 50%;

  /* --- Transiciones (tokens §6.5) --- */
  --c2-transition-fast: border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
  --c2-transition-color: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;

  /* --- Wrapper: lienzo del canon --- */
  background: var(--c2-bg-canvas);
  color: var(--c2-text-body);
  font-family: var(--c2-font-body);
  font-size: 16px;
  line-height: 1.6;
  min-height: 100vh;
  /* clip (no hidden): recorta el desbordamiento horizontal sin crear un
     contenedor de scroll, que rompería el header sticky (canon l.26/l.51). */
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}

/* ==========================================================================
   2. Reset scopeado
   Equivalente del bloque de estilos en el head del canon (l.15-18), sin
   tocar nada fuera de .toracles-candidate2. CANDIDATE1 queda intacto.
   ========================================================================== */
.toracles-candidate2 *,
.toracles-candidate2 *::before,
.toracles-candidate2 *::after {
  box-sizing: border-box;
}

.toracles-candidate2 h1,
.toracles-candidate2 h2,
.toracles-candidate2 h3,
.toracles-candidate2 h4,
.toracles-candidate2 h5,
.toracles-candidate2 h6,
.toracles-candidate2 p,
.toracles-candidate2 ul,
.toracles-candidate2 ol,
.toracles-candidate2 dl,
.toracles-candidate2 dd,
.toracles-candidate2 figure,
.toracles-candidate2 blockquote {
  margin: 0;
}

.toracles-candidate2 ul,
.toracles-candidate2 ol {
  padding: 0;
  list-style: none;
}

.toracles-candidate2 img,
.toracles-candidate2 video,
.toracles-candidate2 svg {
  display: block;
  max-width: 100%;
  height: auto;
}

.toracles-candidate2 a {
  color: var(--c2-gold-base);
  text-decoration: none;
  transition: color 0.18s ease;
}

.toracles-candidate2 a:hover {
  color: var(--c2-gold-light);
}

.toracles-candidate2 button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
}

.toracles-candidate2 input,
.toracles-candidate2 select,
.toracles-candidate2 textarea {
  font: inherit;
  color: inherit;
}

.toracles-candidate2 :focus-visible {
  outline: 2px solid var(--c2-gold-base);
  outline-offset: 2px;
}

/* ==========================================================================
   3. Layout base: contenedores y <main>
   ========================================================================== */

/* Contenedor canónico global: max-width 1300 + padding horizontal fluido
   (tokens §5.1-5.2). Presente en todas las secciones del canon. */
.toracles-candidate2 .c2-container {
  max-width: var(--c2-max-width-site);
  margin-inline: auto;
  padding-inline: var(--c2-pad-x);
}

/* Variante del manifiesto: 1000px para concentración de lectura. */
.toracles-candidate2 .c2-container--manifesto {
  max-width: var(--c2-max-width-manifesto);
}

/* <main> semántico del section map: abraza sólo S2-S11 (secciones
   editoriales); ticker, header y footer quedan fuera. Regla defensiva:
   sirve de ancla de estilos y documenta el landmark obligatorio
   (condición nº2 de la auditoría C2-1). */
.toracles-candidate2 .c2-main {
  display: block;
}

/* ==========================================================================
   4. Tipografía editorial compartida
   Tamaños exactos por elemento en TORACLES_CANDIDATE2_TOKENS.md §4.
   ========================================================================== */

/* H1 único de la home: manifiesto (canon l.83). */
.toracles-candidate2 .c2-hero-title {
  font-family: var(--c2-font-display);
  font-weight: 400;
  font-size: clamp(38px, 6.4vw, 86px);
  line-height: 1.02;
  letter-spacing: -0.015em;
  color: var(--c2-text-heading);
  text-wrap: balance;
}

.toracles-candidate2 .c2-hero-title em {
  font-style: italic;
  color: var(--c2-gold-base);
}

/* H2 de sección (tokens §4.1). Tamaño por defecto: programación/series. */
.toracles-candidate2 .c2-section-title {
  font-family: var(--c2-font-display);
  font-weight: 400;
  font-size: clamp(28px, 3.5vw, 44px);
  line-height: 1.05;
  color: var(--c2-text-heading);
  margin: 0;
  text-wrap: balance;
}

/* Portada editorial: 30-50px (canon l.135). */
.toracles-candidate2 .c2-section-title--featured {
  font-size: clamp(30px, 3.9vw, 50px);
  line-height: 1.04;
}

/* Disector / boletín: 30-54px y 30-52px (canon l.200, l.337). */
.toracles-candidate2 .c2-section-title--lg {
  font-size: clamp(30px, 4.2vw, 54px);
  line-height: 1.02;
}

/* Rutas por color: 26-40px (canon l.315). */
.toracles-candidate2 .c2-section-title--sm {
  font-size: clamp(26px, 3.1vw, 40px);
}

/* Párrafos de lectura (tokens §4.2). El ancho de prosa lo pone la
   plantilla según su medida (60ch/58ch/46ch/44ch). */
.toracles-candidate2 .c2-lead {
  font-size: 16px;
  line-height: 1.62;
  color: var(--c2-text-muted-62);
  text-wrap: pretty;
}

/* Lead del manifiesto: escala fluida y tono .68 (canon l.84). */
.toracles-candidate2 .c2-lead--hero {
  font-size: clamp(16px, 1.5vw, 19px);
  color: var(--c2-text-muted-68);
}

/* Eyebrow mono con filetes laterales (manifiesto, canon l.80-81). */
.toracles-candidate2 .c2-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.24em;
  color: var(--c2-text-muted-50);
  margin-bottom: clamp(24px, 3vw, 40px);
}

.toracles-candidate2 .c2-eyebrow__rule {
  display: block;
  width: 36px;
  height: 1px;
  background: var(--c2-gold-rule-strong);
}

/* Letra capitular de la portada (canon l.136). */
.toracles-candidate2 .c2-dropcap {
  float: left;
  font-family: var(--c2-font-display);
  font-size: 62px;
  line-height: 0.82;
  padding: 4px 12px 0 0;
  color: var(--c2-gold-base);
}

/* Enlaces CTA en mono (LEER EL ANÁLISIS COMPLETO →, canon l.137). */
.toracles-candidate2 .c2-link-cta {
  font-family: var(--c2-font-mono);
  font-size: 11px;
  letter-spacing: 0.13em;
}

/* Enlace afiliado / meta (VER PRECIOS EN TIENDAS ↗, canon l.304). */
.toracles-candidate2 .c2-link-meta {
  font-family: var(--c2-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.11em;
}

/* ==========================================================================
   5. Sección base y cabecera de sección
   ========================================================================== */

/* Sección canónica: divisor inferior universal (tokens §2.6). El fondo
   por defecto es el lienzo del wrapper; los modificadores lo alternan. */
.toracles-candidate2 .c2-section {
  position: relative;
  border-bottom: 1px solid var(--c2-gold-border);
}

.toracles-candidate2 .c2-section--dark {
  background: var(--c2-bg-section-dark);
}

.toracles-candidate2 .c2-section--card {
  background: var(--c2-bg-section-card);
}

/* Para secciones con capas de fondo absolutas (manifiesto, disector). */
.toracles-candidate2 .c2-section--clipped {
  overflow: hidden;
}

/* Paddings verticales por tipo de sección (tokens §5.3). */
.toracles-candidate2 .c2-section--pad-standard {
  padding-block: var(--c2-section-pad);
}

.toracles-candidate2 .c2-section--pad-hero {
  padding-block: var(--c2-section-pad-hero-top) var(--c2-section-pad-hero-bottom);
}

.toracles-candidate2 .c2-section--pad-tall {
  padding-block: var(--c2-section-pad-tall);
}

.toracles-candidate2 .c2-section--pad-cta {
  padding-block: var(--c2-section-pad-cta);
}

.toracles-candidate2 .c2-section--pad-compact {
  padding-block: 26px;
}

/* Etiqueta numerada de sección: "01 · PORTADA", "02 · LA PROGRAMACIÓN"...
   (canon l.119, l.170, l.199, l.242, l.277, l.336). Por defecto lleva
   margen inferior para la variante apilada sobre el H2. */
.toracles-candidate2 .c2-section-label {
  font-family: var(--c2-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.22em;
  color: var(--c2-gold-base);
  margin: 0 0 12px;
}

/* Variante de alerta del disector (canon l.199). */
.toracles-candidate2 .c2-section-label--alert {
  color: var(--c2-color-red);
}

/* Fila de cabecera de sección, variante baseline con regla (portada,
   canon l.118-122): label + regla expansible + meta derecha. */
.toracles-candidate2 .c2-section-head {
  display: flex;
  align-items: baseline;
  gap: 14px;
  margin-bottom: clamp(22px, 2.6vw, 34px);
}

.toracles-candidate2 .c2-section-head .c2-section-label {
  margin-bottom: 0;
}

.toracles-candidate2 .c2-section-head__rule {
  flex: 1;
  height: 1px;
  background: var(--c2-gold-rule);
}

.toracles-candidate2 .c2-section-head__meta {
  font-family: var(--c2-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  color: var(--c2-text-muted-66);
}

/* Variante split: título a la izquierda, nota mono a la derecha
   (programación l.168, series l.240, mercado, colores, boletín). */
.toracles-candidate2 .c2-section-head--split {
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px 20px;
  margin-bottom: 26px;
}

.toracles-candidate2 .c2-section-head__note {
  font-family: var(--c2-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.13em;
  color: var(--c2-text-muted-66);
  line-height: 1.7;
  text-align: right;
}

/* ==========================================================================
   6. Cintillo / ticker (S0 · C2-3)
   Canon l.29-48. Los items son spans; los deltas usan color semántico.
   ========================================================================== */
.toracles-candidate2 .c2-ticker {
  position: relative;
  overflow: hidden;
  height: var(--c2-ticker-height);
  border-bottom: 1px solid var(--c2-gold-border-soft);
  background: var(--c2-bg-section-dark);
}

.toracles-candidate2 .c2-ticker__track {
  display: flex;
  width: 200%;
  animation: tickerScroll 46s linear infinite;
}

/* Pausa del movimiento en interacción (mitigación WCAG 2.2.2 por CSS;
   el control de pausa accesible completo llega con candidate2.js en C2-6,
   según la auditoría C2-1 §4.4). */
.toracles-candidate2 .c2-ticker:hover .c2-ticker__track,
.toracles-candidate2 .c2-ticker:focus-within .c2-ticker__track {
  animation-play-state: paused;
}

/* Track visible del bucle; la copia lleva aria-hidden="true" (canon l.39). */
.toracles-candidate2 .c2-ticker__group {
  display: flex;
  align-items: center;
  gap: 32px;
  width: 50%;
  flex: none;
  padding-left: 24px;
  font-family: var(--c2-font-mono);
  font-size: 11px;
  letter-spacing: 0.07em;
  color: var(--c2-text-muted-55);
  white-space: nowrap;
}

.toracles-candidate2 .c2-ticker__item--live {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--c2-gold-base);
}

.toracles-candidate2 .c2-ticker__dot {
  width: 5px;
  height: 5px;
  border-radius: var(--c2-border-radius-circle);
  background: var(--c2-gold-base);
  animation: blink 2.4s infinite;
}

.toracles-candidate2 .c2-ticker__delta--up {
  color: var(--c2-color-red);
}

.toracles-candidate2 .c2-ticker__delta--down {
  color: var(--c2-color-blue);
}

/* ==========================================================================
   7. Cabecera sticky y navegación (S1 · C2-3)
   Canon l.51-73.
   ========================================================================== */
.toracles-candidate2 .c2-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--c2-bg-header-glass);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--c2-gold-border);
}

.toracles-candidate2 .c2-header__inner {
  max-width: var(--c2-max-width-site);
  margin-inline: auto;
  padding: 10px var(--c2-pad-x);
  min-height: var(--c2-header-min-height);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 8px;
  gap: clamp(14px, 2.4vw, 30px);
}

.toracles-candidate2 .c2-header__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: none;
}

.toracles-candidate2 .c2-header__emblem {
  position: relative;
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

.toracles-candidate2 .c2-header__halo {
  position: absolute;
  inset: -5px;
  border-radius: var(--c2-border-radius-circle);
  background: radial-gradient(circle, var(--c2-gold-halo), transparent 70%);
  animation: haloPulse 5s ease-in-out infinite;
}

.toracles-candidate2 .c2-header__logo {
  position: relative;
  width: 34px;
  height: 34px;
  border-radius: var(--c2-border-radius-circle);
  object-fit: cover;
  border: 1px solid var(--c2-gold-rule-strong);
}

.toracles-candidate2 .c2-header__wordmark-group {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.toracles-candidate2 .c2-header__wordmark {
  font-family: var(--c2-font-display);
  font-size: 23px;
  letter-spacing: 0.17em;
  color: var(--c2-text-brand);
}

.toracles-candidate2 .c2-header__tagline {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.22em;
  color: var(--c2-text-muted-66);
  margin-top: 3px;
}

/* Nav principal (canon l.63-70). El estado activo llega como
   .is-active y/o aria-current="page" desde la plantilla. */
.toracles-candidate2 .c2-nav {
  display: flex;
  gap: clamp(10px, 1.5vw, 22px);
  margin-left: auto;
  font-size: 14px;
  flex-wrap: wrap;
  font-family: var(--c2-font-body);
}

.toracles-candidate2 .c2-nav__link {
  color: var(--c2-text-muted-62);
  padding: 6px 0;
}

.toracles-candidate2 .c2-nav__link.is-active,
.toracles-candidate2 .c2-nav__link[aria-current="page"] {
  color: var(--c2-text-body);
  border-bottom: 1.5px solid var(--c2-gold-base);
}

/* Botón "EL BOLETÍN" de la cabecera (canon l.71). */
.toracles-candidate2 .c2-header__cta {
  flex: none;
  margin-left: auto;
  border: 1px solid var(--c2-gold-border-emphasis);
  background: transparent;
  color: var(--c2-text-highlight);
  font-family: var(--c2-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.13em;
  padding: 9px 15px;
  border-radius: var(--c2-border-radius-btn);
  transition: var(--c2-transition-color);
}

.toracles-candidate2 .c2-header__cta:hover {
  background: var(--c2-gold-base);
  color: var(--c2-bg-canvas);
}

/* ==========================================================================
   8. Hero del manifiesto (primitivas de S2 · C2-4)
   Canon l.79-90. Composición: plantilla home-manifesto.php.
   ========================================================================== */
.toracles-candidate2 .c2-hero {
  text-align: center;
}

.toracles-candidate2 .c2-hero__actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
}

.toracles-candidate2 .c2-hero__signature {
  margin-top: clamp(30px, 4vw, 48px);
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  color: var(--c2-text-muted-66);
}

/* Capas de atmósfera (tokens §2.7). Estructura: <span class="c2-atmosphere
   c2-atmosphere--hero" aria-hidden="true"></span> como primer hijo de la
   sección, que debe llevar c2-section--clipped. */
.toracles-candidate2 .c2-atmosphere {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.toracles-candidate2 .c2-atmosphere--hero {
  background:
    radial-gradient(900px 560px at 50% -14%, rgba(205, 176, 122, 0.16), transparent 68%),
    radial-gradient(700px 460px at 88% 108%, var(--c2-color-ambient-cool), transparent 72%);
}

.toracles-candidate2 .c2-atmosphere--dissector {
  background: radial-gradient(760px 420px at 50% 36%, var(--c2-color-red-bg), transparent 70%);
}

.toracles-candidate2 .c2-atmosphere--grid {
  opacity: 0.5;
  background-image: repeating-linear-gradient(
    0deg,
    transparent 0 33px,
    var(--c2-gold-grid) 33px 34px
  );
}

/* ==========================================================================
   9. Badges (incluido el badge de maqueta por sección)
   Decisión ASTRA/User nº5: rótulo por sección para datos de maqueta.
   ========================================================================== */

/* Badge de contenido: "COMBO DE LA SEMANA" (canon l.131). */
.toracles-candidate2 .c2-badge {
  display: inline-block;
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.15em;
  padding: 4px 9px;
  background: var(--c2-color-red);
  color: var(--c2-bg-canvas);
}

.toracles-candidate2 .c2-badge--gold {
  background: var(--c2-gold-base);
}

.toracles-candidate2 .c2-badge--green {
  background: var(--c2-color-green);
}

.toracles-candidate2 .c2-badge--blue {
  background: var(--c2-color-blue);
}

/* Badge de maqueta por sección: «DATOS DE MAQUETA LOCAL». Discreto,
   borde punteado (mismo lenguaje que los wireframes publicitarios,
   tokens §2.6). Colocación: junto a .c2-section-head__meta o al inicio
   de la sección afectada. Texto recomendado (section map §7): mono 10px. */
.toracles-candidate2 .c2-badge--mock {
  display: inline-block;
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.15em;
  padding: 3px 8px;
  border: 1px dashed var(--c2-gold-border-dashed);
  background: transparent;
  color: var(--c2-text-muted-66);
}

/* ==========================================================================
   10. Botones (tokens §4.3 y §6.5)
   Estados hover de la fuente convertidos en :hover reales.
   ========================================================================== */
.toracles-candidate2 .c2-btn {
  display: inline-block;
  font-family: var(--c2-font-mono);
  font-size: 11.5px;
  letter-spacing: 0.13em;
  line-height: 1.2;
  padding: 14px 24px;
  border-radius: var(--c2-border-radius-btn);
  cursor: pointer;
  transition: var(--c2-transition-color);
}

/* Primario dorado: "EMPEZAR POR LA PORTADA" (canon l.86) y
   "APUNTARME" (l.343, con variante --compact). */
.toracles-candidate2 .c2-btn--primary {
  font-weight: 600;
  background: var(--c2-gold-base);
  color: var(--c2-bg-canvas);
  border: none;
}

.toracles-candidate2 .c2-btn--primary:hover {
  background: var(--c2-gold-light);
}

.toracles-candidate2 .c2-btn--compact {
  padding: 13px 20px;
}

/* Secundario delineado: "QUIÉN ES EL ORÁCULO" (canon l.87). Su destino
   está PENDIENTE de decisión ASTRA (sección map §9.1); la clase existe,
   el enlace lo decide C2-4. */
.toracles-candidate2 .c2-btn--outline {
  border: 1px solid var(--c2-gold-border-strong);
  background: transparent;
  color: var(--c2-text-body);
}

.toracles-candidate2 .c2-btn--outline:hover {
  border-color: var(--c2-gold-base);
  color: var(--c2-text-highlight);
}

/* Tabs de ventana temporal del mercado (canon l.282 + script l.416-417).
   El estado activo lo gestiona candidate2.js (C2-6) vía .is-active y/o
   aria-pressed="true". */
.toracles-candidate2 .c2-btn--tab {
  font-size: 11px;
  letter-spacing: 0.1em;
  padding: 9px 14px;
  border: 1px solid rgba(205, 176, 122, 0.28);
  background: transparent;
  color: var(--c2-text-muted-70);
}

.toracles-candidate2 .c2-btn--tab:hover,
.toracles-candidate2 .c2-btn--tab.is-active,
.toracles-candidate2 .c2-btn--tab[aria-pressed="true"] {
  border-color: var(--c2-gold-base);
  background: var(--c2-gold-base);
  color: var(--c2-bg-canvas);
}

/* ==========================================================================
   11. Cards, slots de imagen, tramas y progreso
   Canon l.126-160 (portada), l.178-189 (programación), l.207-219 (disector),
   l.249-256 (series), l.320-326 (colores).
   ========================================================================== */

/* Card base con divisor arquitectónico por box-shadow (tokens §2.6). */
.toracles-candidate2 .c2-card {
  position: relative;
  background: var(--c2-bg-canvas);
  box-shadow: 0 0 0 1px var(--c2-gold-border);
  padding: 22px 20px 20px;
  transition: var(--c2-transition-fast);
}

.toracles-candidate2 .c2-card:hover {
  background: var(--c2-bg-card-hover);
}

/* Card con borde (series, canon l.249). */
.toracles-candidate2 .c2-card--outline {
  box-shadow: none;
  border: 1px solid var(--c2-gold-border-soft);
}

.toracles-candidate2 .c2-card--outline:hover {
  border-color: var(--c2-gold-base);
}

/* Card sobre superficie panel (series, canon l.249). */
.toracles-candidate2 .c2-card--panel {
  background: var(--c2-bg-section-card);
}

/* Estado interactivo (disector; sustituye al estilo inline dinámico del
   script original, canon l.435-437). Elevación + glow carmesí + borde oro. */
.toracles-candidate2 .c2-card--interactive {
  text-align: left;
  overflow: hidden;
  font: inherit;
  color: inherit;
  width: 100%;
}

.toracles-candidate2 .c2-card--interactive.is-active {
  border-color: var(--c2-gold-base);
  background: var(--c2-bg-card-hover);
  box-shadow: 0 24px 60px -30px var(--c2-color-red-shadow);
  transform: translateY(-4px);
}

/* Slot de imagen/placeholder con trama diagonal (tokens §2.7.5).
   Hasta que exista imagen destacada real, el placeholder se mantiene
   rotulado (section map §1). */
.toracles-candidate2 .c2-card__media {
  position: relative;
  aspect-ratio: 16 / 9;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-bottom: 1px solid rgba(205, 176, 122, 0.14);
  background-image: repeating-linear-gradient(
    135deg,
    var(--c2-gold-pattern) 0 8px,
    transparent 8px 16px
  );
}

.toracles-candidate2 .c2-card__media--square {
  aspect-ratio: 1 / 1;
  border-bottom: 0;
}

.toracles-candidate2 .c2-card__media--fixed {
  aspect-ratio: auto;
  height: 148px;
}

.toracles-candidate2 .c2-card__media--featured {
  border: 1px solid var(--c2-gold-border-soft);
  border-bottom: 1px solid var(--c2-gold-border-soft);
  background-image: repeating-linear-gradient(
    135deg,
    rgba(205, 176, 122, 0.1) 0 9px,
    transparent 9px 18px
  );
}

.toracles-candidate2 .c2-card__media-label {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--c2-text-muted-66);
}

/* Haz de escaneo sobre slots (canon l.128, l.209; tokens §6.3). */
.toracles-candidate2 .c2-card__sweep {
  position: absolute;
  left: 0;
  right: 0;
  height: 28%;
  background: linear-gradient(180deg, transparent, var(--c2-gold-sweep), transparent);
  animation: sweep 7s linear infinite;
}

.toracles-candidate2 .c2-card__sweep--strong {
  height: 32%;
  background: linear-gradient(180deg, transparent, rgba(205, 176, 122, 0.14), transparent);
  animation-duration: 6s;
}

/* Título H3 de card (tokens §4.1: 21px secundarias/disector/colores,
   23px programación/series). */
.toracles-candidate2 .c2-card__title {
  font-family: var(--c2-font-display);
  font-weight: 400;
  font-size: 21px;
  line-height: 1.14;
  color: var(--c2-text-card-h3);
  margin: 0;
}

.toracles-candidate2 .c2-card__title--lg {
  font-size: 23px;
  line-height: 1.12;
}

/* Cuerpo de card (tokens §4.2). */
.toracles-candidate2 .c2-card__text {
  font-size: 14px;
  line-height: 1.5;
  color: var(--c2-text-muted-56);
  font-family: var(--c2-font-body);
}

.toracles-candidate2 .c2-card__text--lg {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--c2-text-muted-58);
}

/* Metadatos mono de card (día, serie, PIEZA n/3, etiqueta). */
.toracles-candidate2 .c2-card__meta {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--c2-text-muted-66);
}

/* Punto de color de cita/mercado (canon l.183, l.296). */
.toracles-candidate2 .c2-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: var(--c2-border-radius-circle);
  background: currentColor;
  flex: none;
}

/* Barra de progreso de series (canon l.253). El ancho lo fija la
   plantilla mediante la custom property, sin JS ni estilos inline:
   <span class="c2-progress__bar" style="--c2-progress-w: 57%">. */
.toracles-candidate2 .c2-progress {
  height: 3px;
  background: var(--c2-gold-border);
}

.toracles-candidate2 .c2-progress__bar {
  display: block;
  height: 3px;
  width: var(--c2-progress-w, 0%);
  background: var(--c2-gold-base);
}

/* ==========================================================================
   12. Grids canónicos (tokens §5.4) y métricas de la franja viva
   Todos fluidos con repeat(auto-fit, minmax(...)): la responsividad del
   canon no depende de breakpoints.
   ========================================================================== */
.toracles-candidate2 .c2-grid {
  display: grid;
}

/* Franja de datos vivos (canon l.94). Separación por box-shadow inset. */
.toracles-candidate2 .c2-grid--live {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0;
}

.toracles-candidate2 .c2-grid--live > *:not(:last-child) {
  padding: 20px 18px;
  box-shadow: inset -1px 0 0 var(--c2-gold-divider-column);
}

.toracles-candidate2 .c2-grid--live > *:last-child {
  padding: 20px 18px;
}

/* Portada: destacado + secundarias (canon l.124). */
.toracles-candidate2 .c2-grid--featured {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(26px, 3.2vw, 52px);
  align-items: start;
}

/* Programación semanal: 3 citas con divisor de 1px (canon l.176). */
.toracles-candidate2 .c2-grid--schedule {
  grid-template-columns: repeat(auto-fit, minmax(268px, 1fr));
  gap: 1px;
}

/* Disector: 3 piezas (canon l.204). */
.toracles-candidate2 .c2-grid--dissector {
  grid-template-columns: repeat(auto-fit, minmax(248px, 1fr));
  gap: clamp(16px, 2vw, 26px);
}

/* Consola de métricas del disector (canon l.223). */
.toracles-candidate2 .c2-grid--metrics {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 24px;
  align-items: center;
}

/* Series: 4 tarjetas (canon l.247). */
.toracles-candidate2 .c2-grid--series {
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: clamp(14px, 1.8vw, 22px);
}

/* Mercado: lead + tabla (canon l.275). */
.toracles-candidate2 .c2-grid--market {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(26px, 3.4vw, 54px);
}

/* Rutas por color: 5 cajas WUBRG (canon l.318). */
.toracles-candidate2 .c2-grid--colors {
  grid-template-columns: repeat(auto-fit, minmax(158px, 1fr));
  gap: 1px;
}

/* Boletín: pitch + formulario (canon l.334). */
.toracles-candidate2 .c2-grid--newsletter {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(28px, 4vw, 58px);
  align-items: center;
}

/* Footer: 4 columnas (canon l.358). */
.toracles-candidate2 .c2-grid--footer {
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
  gap: 32px;
}

/* Grid con marco de 1px para divisores arquitectónicos
   (programación y colores, tokens §2.6). */
.toracles-candidate2 .c2-grid--divided {
  border: 1px solid var(--c2-gold-border);
}

/* Métricas de la franja viva (canon l.96-109) y de la consola del
   disector (l.229-231). */
.toracles-candidate2 .c2-metric__value {
  font-family: var(--c2-font-display);
  font-size: clamp(26px, 2.6vw, 34px);
  line-height: 1;
  color: var(--c2-text-heading);
}

.toracles-candidate2 .c2-metric__value--gold {
  color: var(--c2-gold-base);
}

.toracles-candidate2 .c2-metric__label {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.15em;
  color: var(--c2-text-muted-66);
  margin-top: 8px;
}

/* ==========================================================================
   13. Footer (S12 · C2-4)
   Canon l.357-385.
   ========================================================================== */
.toracles-candidate2 .c2-footer {
  background: var(--c2-bg-section-dark);
}

.toracles-candidate2 .c2-footer__inner {
  padding-block: clamp(34px, 4vw, 56px);
}

.toracles-candidate2 .c2-footer__brand {
  font-family: var(--c2-font-display);
  font-size: 22px;
  letter-spacing: 0.17em;
  color: var(--c2-gold-light);
  margin-bottom: 12px;
}

.toracles-candidate2 .c2-footer__bio {
  font-size: 14px;
  line-height: 1.6;
  color: var(--c2-text-muted-66);
  max-width: 34ch;
}

.toracles-candidate2 .c2-footer__col {
  display: flex;
  flex-direction: column;
  gap: 9px;
  font-size: 14.5px;
}

.toracles-candidate2 .c2-footer__col-title {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--c2-text-muted-66);
  margin-bottom: 4px;
}

.toracles-candidate2 .c2-footer__link {
  color: var(--c2-text-muted-70);
  font-size: 14.5px;
  font-family: var(--c2-font-body);
}

/* Barra legal: borde superior sólo dentro del ancho 1300 (canon l.382). */
.toracles-candidate2 .c2-footer__legal {
  max-width: var(--c2-max-width-site);
  margin-inline: auto;
  border-top: 1px solid var(--c2-gold-divider-column);
  padding: 18px var(--c2-pad-x);
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  color: var(--c2-text-muted-68);
  line-height: 1.7;
}

/* ==========================================================================
   14. Utilidades de accesibilidad
   ========================================================================== */

/* Texto sólo para lectores de pantalla: <label> real del boletín y
   equivalents (auditoría C2-1 §4.5). */
.toracles-candidate2 .c2-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ==========================================================================
   15. Keyframes canónicos (canon l.19-22, tokens §6.1-6.4)
   Nombres exactos del canon; verificado que theme.css/sections.css no
   definen keyframes (sin colisión con CANDIDATE1).
   ========================================================================== */
@keyframes tickerScroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

@keyframes haloPulse {
  0%,
  100% {
    opacity: 0.3;
    transform: scale(1);
  }
  50% {
    opacity: 0.62;
    transform: scale(1.12);
  }
}

@keyframes sweep {
  0% {
    transform: translateY(-120%);
  }
  100% {
    transform: translateY(420%);
  }
}

@keyframes blink {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.15;
  }
}

/* ==========================================================================
   16. prefers-reduced-motion (condición obligatoria C2-1 §4.4)
   El canon carece de este bloque; los mockups secundarios del mismo
   paquete sí lo traen. Aquí se neutralizan las cuatro animaciones
   canónicas y todas las transiciones del scope.
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .toracles-candidate2 *,
  .toracles-candidate2 *::before,
  .toracles-candidate2 *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .toracles-candidate2 .c2-ticker__track,
  .toracles-candidate2 .c2-ticker__dot,
  .toracles-candidate2 .c2-header__halo,
  .toracles-candidate2 .c2-card__sweep {
    animation: none;
  }
}

/* ==========================================================================
   17. Responsive base
   El canon es fluid-first: clamp() en tipografía/paddings y
   repeat(auto-fit, minmax()) en todos los grids hacen que la base no
   necesite breakpoints. Sólo excepciones puntuales de composición.
   ========================================================================== */
@media (max-width: 600px) {
  /* La nav envuelve bajo la marca y deja de empujarse a la derecha. */
  .toracles-candidate2 .c2-nav {
    margin-left: 0;
  }

  /* La fila label + regla + meta admite envoltado en pantallas estrechas. */
  .toracles-candidate2 .c2-section-head {
    flex-wrap: wrap;
  }

  /* Nota derecha de la cabecera split pasa a alineación izquierda. */
  .toracles-candidate2 .c2-section-head__note {
    text-align: left;
  }
}

/* ==========================================================================
   18. Componentes por sección (Fase C2-4)
   Diferidos por C2-2 (TORACLES_CANDIDATE2_C2-2_CSS.md §Pendientes). Cada
   bloque cita su fuente canónica. Los valores de datos por elemento (tono
   de sección, swatch WUBRG, ancho de progreso) llegan como custom
   properties --c2-accent / --c2-swatch / --c2-swatch-glow / --c2-progress-w
   desde la plantilla: mismo patrón sancionado por .c2-progress__bar.
   ========================================================================== */

/* --- 18.1 Manifiesto (S2) y franja de datos vivos (S3) --- */

/* Lead del manifiesto centrado a 60ch (canon l.84). */
.toracles-candidate2 .c2-hero .c2-lead--hero {
  margin-inline: auto;
  margin-bottom: clamp(26px, 3.4vw, 38px);
  max-width: 60ch;
}

/* Badge de maqueta bajo la firma del manifiesto (canon l.89, cifra mock). */
.toracles-candidate2 .c2-hero__mock {
  margin-top: 14px;
}

/* Franja viva: borde superior + superficie translúcida (canon l.93). */
.toracles-candidate2 .c2-live {
  position: relative;
  border-top: 1px solid var(--c2-gold-border);
  background: var(--c2-bg-strip);
}

/* Fila discreta del badge de maqueta de la franja (auditoría C2-1 §1:
   la franja entera se rotula si alguna celda es mock). */
.toracles-candidate2 .c2-live__notice {
  display: flex;
  justify-content: flex-end;
  padding-top: 10px;
}

/* Imagen real dentro de cualquier slot de media: cubre el ratio del slot
   sin deformarse (sustituye al placeholder de trama cuando existe
   imagen destacada real; section map §1). */
.toracles-candidate2 .c2-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* --- 18.2 Portada editorial (S4 · canon l.115-163) --- */

/* Media del destacado (canon l.126-129). */
.toracles-candidate2 .c2-featured__media {
  margin-bottom: 20px;
}

/* Fila kicker + metadatos mono del destacado (canon l.130-134). */
.toracles-candidate2 .c2-featured__meta-row {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 14px;
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.15em;
}

/* Extracto del destacado con capitular (canon l.136). */
.toracles-candidate2 .c2-featured__excerpt {
  margin-bottom: 18px;
  font-size: 17px;
  line-height: 1.66;
  color: var(--c2-text-muted-72);
  max-width: 58ch;
  text-wrap: pretty;
}

/* Card secundaria: miniatura cuadrada 112px + texto (canon l.142-149). */
.toracles-candidate2 .c2-featured-secondary {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(205, 176, 122, 0.14);
}

.toracles-candidate2 .c2-featured-secondary__kicker {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--c2-accent, var(--c2-gold-base));
  margin-bottom: 9px;
}

.toracles-candidate2 .c2-featured-secondary .c2-card__title {
  margin-bottom: 8px;
}

/* Columna de texto de la secundaria (canon l.144: min-width:0). */
.toracles-candidate2 .c2-featured-secondary__body {
  min-width: 0;
}

/* Columna de secundarias (canon l.140). */
.toracles-candidate2 .c2-featured__aside {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 22px;
}

/* Estado vacío honesto compartido (portada sin posts; section map §4/S4). */
.toracles-candidate2 .c2-empty {
  border: 1px dashed var(--c2-gold-border-dashed);
  padding: 26px 20px;
  text-align: center;
  font-family: var(--c2-font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--c2-text-muted-66);
}

/* --- 18.3 Cards con media superior: programación y disector
   (canon l.178-189, l.207-219). .c2-card trae padding; estas variantes
   lo anulan para que la media sangre hasta el borde del ring. --- */

.toracles-candidate2 .c2-card--flush {
  display: flex;
  flex-direction: column;
  padding: 0;
}

.toracles-candidate2 .c2-card__body {
  display: flex;
  flex-direction: column;
  gap: 11px;
  flex: 1;
  padding: 22px 20px 24px;
}

.toracles-candidate2 .c2-card__body--tight {
  gap: 0;
  padding: 18px 18px 20px;
}

/* Fila día + punto de color de las citas (canon l.183). */
.toracles-candidate2 .c2-schedule__day {
  display: flex;
  align-items: center;
  gap: 9px;
}

/* Cuenta atrás «Siguiente en …» en oro (canon l.173). */
.toracles-candidate2 .c2-next-delivery {
  color: var(--c2-gold-base);
}

/* CTA mono dorado al pie de card (canon l.186). */
.toracles-candidate2 .c2-card__cta {
  margin-top: auto;
  font-family: var(--c2-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.11em;
  color: var(--c2-gold-base);
}

/* Punto de color alimentado por --c2-accent (citas, mercado). */
.toracles-candidate2 .c2-dot--accent {
  background: var(--c2-accent, var(--c2-gold-base));
}

/* --- 18.4 Disector (S6 · canon l.194-235; maqueta estática C2-4) --- */

/* Cabecera centrada de la sección (canon l.198-202). */
.toracles-candidate2 .c2-dissector-head {
  text-align: center;
  margin-bottom: clamp(26px, 3.4vw, 44px);
}

.toracles-candidate2 .c2-dissector-head .c2-section-label {
  display: block;
  margin-inline: auto;
  margin-bottom: 14px;
}

.toracles-candidate2 .c2-dissector-head .c2-section-title {
  margin-inline: auto;
  margin-bottom: 14px;
  max-width: 19ch;
}

.toracles-candidate2 .c2-dissector-head .c2-lead {
  margin-inline: auto;
  max-width: 56ch;
}

/* Precio mono de la pieza (canon l.214). */
.toracles-candidate2 .c2-card__price {
  font-family: var(--c2-font-mono);
  font-size: 12px;
  color: var(--c2-gold-base);
}

/* Media de pieza del disector: 186px (canon l.207), sobre la base
   --fixed de 148px de las citas. */
.toracles-candidate2 .c2-card__media--tall {
  height: 186px;
}

/* Fila PIEZA n/3 + precio (canon l.212-215). */
.toracles-candidate2 .c2-card__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 9px;
}

.toracles-candidate2 .c2-card__text--mt {
  margin-top: 8px;
}

/* Consola LECTURA DEL ORÁCULO (canon l.223-233). Se combina con
   .c2-grid.c2-grid--metrics para el reparto en columnas. */
.toracles-candidate2 .c2-dissector__console {
  margin-top: clamp(16px, 2vw, 24px);
  border: 1px solid rgba(205, 176, 122, 0.22);
  background: var(--c2-bg-readout);
  padding: clamp(18px, 2.4vw, 28px);
}

.toracles-candidate2 .c2-dissector__readout {
  min-width: 0;
}

.toracles-candidate2 .c2-dissector__console-label {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  color: var(--c2-color-red);
  margin-bottom: 10px;
}

.toracles-candidate2 .c2-dissector__reading {
  font-size: 16px;
  line-height: 1.62;
  color: var(--c2-text-muted-84);
  text-wrap: pretty;
}

.toracles-candidate2 .c2-dissector__metrics {
  display: flex;
  gap: 26px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.toracles-candidate2 .c2-metric__value--green {
  color: var(--c2-color-green);
}

/* --- 18.5 Series (S7 · canon l.237-259) --- */

.toracles-candidate2 .c2-series-card .c2-card__meta {
  margin-bottom: 12px;
}

.toracles-candidate2 .c2-series-card .c2-card__title--lg {
  margin-bottom: 10px;
}

.toracles-candidate2 .c2-series-card .c2-card__text {
  margin-bottom: 18px;
}

/* Label de progreso dorado (canon l.254). */
.toracles-candidate2 .c2-card__meta--gold {
  color: var(--c2-gold-base);
  letter-spacing: 0.13em;
}

.toracles-candidate2 .c2-series-card .c2-progress {
  margin-bottom: 9px;
}

/* --- 18.6 Publicidad de maqueta (S4 rect 300×250 y S8 banner 970×90) ---
   Cajas wireframe rotuladas: nunca AdSense real en staging (section
   map §4/S8; auditoría C2-1 §3). */

.toracles-candidate2 .c2-ad {
  border: 1px dashed var(--c2-gold-border-dashed);
  padding: 22px 16px;
  text-align: center;
  background: var(--c2-bg-ad-slot);
}

.toracles-candidate2 .c2-ad__label {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  color: var(--c2-text-muted-68);
  margin-bottom: 10px;
}

.toracles-candidate2 .c2-ad__slot {
  height: 230px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: repeating-linear-gradient(
    135deg,
    rgba(205, 176, 122, 0.07) 0 8px,
    transparent 8px 16px
  );
}

/* Banner 970×90: slot con su propio borde discontinuo (canon l.265). */
.toracles-candidate2 .c2-ad__slot--banner {
  height: 96px;
  border: 1px dashed var(--c2-gold-border-dashed);
  background-image: repeating-linear-gradient(
    135deg,
    rgba(205, 176, 122, 0.06) 0 8px,
    transparent 8px 16px
  );
}

/* Promo editorial interna: sustituto limpio de AdSense en staging (Oleada 3) */
.toracles-candidate2 .c2-ad__promo {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  width: 100%;
  height: 100%;
  padding: 16px 20px;
  box-sizing: border-box;
  transition: background-color 0.2s ease;
  color: inherit;
}

.toracles-candidate2 .c2-ad__promo:hover,
.toracles-candidate2 .c2-ad__promo:focus-visible {
  background-color: rgba(205, 176, 122, 0.06);
  text-decoration: none;
}

.toracles-candidate2 .c2-ad__promo-tag {
  font-family: var(--c2-font-mono);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--c2-gold-base);
  margin-bottom: 8px;
}

.toracles-candidate2 .c2-ad__promo-title {
  font-family: var(--c2-font-body);
  font-size: 15px;
  line-height: 1.4;
  color: var(--c2-text-heading);
  margin-bottom: 12px;
  max-width: 32ch;
  text-align: center;
}

.toracles-candidate2 .c2-ad__promo-cta {
  font-family: var(--c2-font-mono);
  font-size: 12px;
  letter-spacing: 0.05em;
  color: var(--c2-gold-light);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid var(--c2-gold-border);
  padding-bottom: 2px;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.toracles-candidate2 .c2-ad__promo:hover .c2-ad__promo-cta,
.toracles-candidate2 .c2-ad__promo:focus-visible .c2-ad__promo-cta {
  color: #ffffff;
  border-color: var(--c2-gold-base);
}

@media (min-width: 768px) {
  .toracles-candidate2 .c2-ad__slot--banner .c2-ad__promo {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 0 32px;
    text-align: left;
  }

  .toracles-candidate2 .c2-ad__slot--banner .c2-ad__promo-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .toracles-candidate2 .c2-ad__slot--banner .c2-ad__promo-tag {
    margin-bottom: 0;
  }

  .toracles-candidate2 .c2-ad__slot--banner .c2-ad__promo-title {
    margin-bottom: 0;
    max-width: 55ch;
    text-align: left;
    font-size: 14px;
  }

  .toracles-candidate2 .c2-ad__slot--banner .c2-ad__promo-cta {
    flex-shrink: 0;
    margin-left: 20px;
  }
}


/* --- 18.7 Mercado (S9 · canon l.272-309) --- */

.toracles-candidate2 .c2-market__copy .c2-lead {
  margin-bottom: 24px;
  max-width: 44ch;
}

/* Selector de ventanas temporales (canon l.280-284). En C2-4 se renderiza
   deshabilitado (sin datos ni JS); C2-6 lo activa con aria-pressed. */
.toracles-candidate2 .c2-market__windows {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.toracles-candidate2 .c2-market__providers {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  margin-top: 24px;
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--c2-text-muted-66);
}

/* Panel-tabla (canon l.290-306). Las filas reales llegarán con el
   endpoint del plugin (C2-6.4); aquí vive el layout completo. */
.toracles-candidate2 .c2-market-panel {
  min-width: 0;
  border: 1px solid var(--c2-gold-rule);
  background: var(--c2-bg-section-card);
}

.toracles-candidate2 .c2-market-panel__head {
  display: flex;
  padding: 11px 16px;
  border-bottom: 1px solid var(--c2-gold-border);
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  color: var(--c2-text-muted-66);
}

.toracles-candidate2 .c2-market-panel__th {
  flex: 1;
}

.toracles-candidate2 .c2-market-panel__th--price {
  width: 84px;
  text-align: right;
}

.toracles-candidate2 .c2-market-panel__th--delta {
  width: 70px;
  text-align: right;
}

.toracles-candidate2 .c2-market-panel__row {
  display: flex;
  align-items: center;
  padding: 13px 16px;
  border-bottom: 1px solid var(--c2-gold-border-subtle);
  transition: var(--c2-transition-color);
}

.toracles-candidate2 .c2-market-panel__row:hover {
  background: var(--c2-bg-card-hover);
}

.toracles-candidate2 .c2-market-panel__swatch {
  width: 3px;
  height: 22px;
  margin-right: 12px;
  flex: none;
  background: var(--c2-accent, var(--c2-gold-base));
}

.toracles-candidate2 .c2-market-panel__name {
  flex: 1;
  min-width: 0;
  font-size: 15px;
  color: var(--c2-text-body);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.toracles-candidate2 .c2-market-panel__price {
  width: 84px;
  text-align: right;
  font-family: var(--c2-font-mono);
  font-size: 12.5px;
  color: var(--c2-text-highlight);
}

.toracles-candidate2 .c2-market-panel__delta {
  width: 70px;
  text-align: right;
  font-family: var(--c2-font-mono);
  font-size: 12px;
  color: var(--c2-accent, var(--c2-gold-base));
}

/* Estado honesto sin endpoint: la matriz demo está prohibida en render
   (section map §4/S9). */
.toracles-candidate2 .c2-market-panel__empty {
  padding: 26px 16px;
  font-family: var(--c2-font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--c2-text-muted-66);
  text-align: center;
}

.toracles-candidate2 .c2-market-panel__foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  flex-wrap: wrap;
}

.toracles-candidate2 .c2-market-panel__foot-label {
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.11em;
  color: var(--c2-text-muted-66);
}

/* --- 18.8 Rutas por color (S10 · canon l.311-329) --- */

.toracles-candidate2 .c2-color-card {
  display: block;
  background: var(--c2-bg-canvas);
  padding: 24px 20px 26px;
  box-shadow: 0 0 0 1px var(--c2-gold-border);
  transition: var(--c2-transition-color);
}

.toracles-candidate2 .c2-color-card:hover {
  background: var(--c2-bg-card-hover);
}

/* Swatch WUBRG alimentado por --c2-swatch / --c2-swatch-glow. */
.toracles-candidate2 .c2-color-dot {
  display: block;
  width: 28px;
  height: 28px;
  border-radius: var(--c2-border-radius-circle);
  background: var(--c2-swatch, var(--c2-gold-base));
  box-shadow: 0 0 24px var(--c2-swatch-glow, transparent);
  margin-bottom: 18px;
}

.toracles-candidate2 .c2-color-card .c2-card__title {
  display: block;
  line-height: 1.1;
}

.toracles-candidate2 .c2-color-card .c2-card__text {
  display: block;
  margin-top: 8px;
  color: var(--c2-text-muted-55);
}

.toracles-candidate2 .c2-color-card .c2-card__meta {
  display: block;
  margin-top: 14px;
}

/* --- 18.9 Boletín (S11 · canon l.331-355) --- */

.toracles-candidate2 .c2-newsletter__copy .c2-lead {
  max-width: 46ch;
}

/* Caja del campo + botón (canon l.341-344). */
.toracles-candidate2 .c2-newsletter__field {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  border: 1px solid var(--c2-gold-border-input);
  background: var(--c2-bg-input);
  padding: 5px 5px 5px 16px;
}

/* El foco visible lo garantiza el :focus-visible global del scope
   (§2): no se replica el outline:none del canon. */
.toracles-candidate2 .c2-newsletter__input {
  flex: 1;
  min-width: 160px;
  background: transparent;
  border: none;
  color: var(--c2-text-highlight);
  font-size: 16px;
  padding: 13px 0;
  font-family: var(--c2-font-body);
}

/* Feedback accesible del estado no conectado (auditoría C2-1 §4.5:
   respuesta explícita en región aria-live="polite"). */
.toracles-candidate2 .c2-newsletter__feedback {
  margin-top: 14px;
  font-family: var(--c2-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.1em;
  color: var(--c2-text-muted-66);
}

/* Prueba social de maqueta: trío de círculos + cifra (canon l.345-352). */
.toracles-candidate2 .c2-newsletter__pilots {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 14px;
  font-family: var(--c2-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.1em;
  color: var(--c2-text-muted-66);
}

.toracles-candidate2 .c2-newsletter__dots {
  display: flex;
}

.toracles-candidate2 .c2-newsletter__dot {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-radius: var(--c2-border-radius-circle);
}

.toracles-candidate2 .c2-newsletter__dot + .c2-newsletter__dot {
  margin-left: -7px;
}

.toracles-candidate2 .c2-newsletter__dot--blue {
  background: var(--c2-color-blue);
}

.toracles-candidate2 .c2-newsletter__dot--red {
  background: var(--c2-color-red);
}

.toracles-candidate2 .c2-newsletter__dot--green {
  background: var(--c2-color-green);
}

/* ==========================================================================
   19. Páginas de Sección CANDIDATE2 (Fase C2-5: Commander, Combos, Mazos)
   Grids multi-columna, filtros locales, fichas de comandante y badges de ruta.
   ========================================================================== */
.toracles-candidate2 .c2-grid--3col {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: clamp(18px, 2.4vw, 32px);
}

.toracles-candidate2 .c2-grid--2col {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: clamp(20px, 2.8vw, 40px);
}

.toracles-candidate2 .c2-badge--future {
  display: inline-block;
  font-family: var(--c2-font-mono);
  font-size: 10px;
  letter-spacing: 0.15em;
  padding: 3px 8px;
  border: 1px dashed var(--c2-gold-border-dashed);
  background: rgba(205, 176, 122, 0.08);
  color: var(--c2-gold-base);
}

.toracles-candidate2 .c2-filter-bar {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 28px;
  align-items: center;
}

.toracles-candidate2 .c2-filter-input,
.toracles-candidate2 .c2-filter-select {
  min-height: 42px;
  padding: 0.5rem 1rem;
  background: var(--c2-bg-input);
  border: 1px solid var(--c2-gold-border-input);
  border-radius: var(--c2-border-radius-btn);
  color: var(--c2-text-heading);
  font-family: var(--c2-font-body);
  font-size: 14px;
}

.toracles-candidate2 .c2-filter-select {
  cursor: pointer;
}

/* --- Commander Archive: Espaciado y respiración editorial (VA-003) --- */
.toracles-candidate2 .c2-section--commander-archive {
  padding-block: clamp(52px, 6.5vw, 92px);
}

.toracles-candidate2 .c2-section--commander-archive .c2-section-head {
  margin-bottom: clamp(26px, 3.2vw, 38px);
}

.toracles-candidate2 .c2-section--commander-archive .c2-lead {
  font-size: 15px;
  line-height: 1.7;
  color: var(--c2-text-muted-84);
  max-width: 860px;
  margin: 0 0 clamp(28px, 3.4vw, 40px);
}

.toracles-candidate2 .c2-section--commander-archive .c2-filter-bar {
  gap: 14px 16px;
  margin-bottom: clamp(34px, 4.2vw, 48px);
}

.toracles-candidate2 .c2-section--commander-archive .c2-grid--3col {
  gap: clamp(24px, 3vw, 38px);
}

/* Cards Commander con mayor respiración interna y jerarquía */
.toracles-candidate2 .c2-card--commander {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background: var(--c2-bg-section-card);
  border: 1px solid var(--c2-gold-border);
  padding: clamp(26px, 2.8vw, 34px);
  box-shadow: none;
}

.toracles-candidate2 .c2-card--commander .c2-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 0;
  gap: 0;
}

.toracles-candidate2 .c2-card--commander .c2-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}

.toracles-candidate2 .c2-card--commander .c2-card__title {
  margin: 0 0 12px;
  line-height: 1.25;
}

.toracles-candidate2 .c2-card--commander .c2-card__text {
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--c2-text-muted-84);
  margin: 0 0 16px;
}

.toracles-candidate2 .c2-commander-specs {
  list-style: none;
  padding: 12px 0;
  margin: 18px 0;
  font-family: var(--c2-font-mono);
  font-size: 12px;
  line-height: 1.7;
  color: var(--c2-text-muted-70);
  border-top: 1px dashed var(--c2-gold-border-subtle);
  border-bottom: 1px dashed var(--c2-gold-border-subtle);
}

.toracles-candidate2 .c2-commander-specs li {
  margin: 6px 0;
}

.toracles-candidate2 .c2-commander-specs strong {
  color: var(--c2-gold-base);
  font-weight: 500;
}

.toracles-candidate2 .c2-card--commander .c2-card__tags {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 16px;
}

.toracles-candidate2 .c2-card--commander .c2-card__tags .c2-badge {
  border-style: solid;
  color: var(--c2-gold-light);
}

.toracles-candidate2 .c2-card--commander .c2-card__cta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--c2-gold-border-subtle);
}

.toracles-candidate2 .c2-card__identity {
  font-family: var(--c2-font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
}

.toracles-candidate2 .c2-card__identity--dimir {
  color: var(--c2-color-blue);
}

.toracles-candidate2 .c2-card__identity--izzet {
  color: var(--c2-color-red);
}

.toracles-candidate2 .c2-card__identity--green {
  color: var(--c2-color-green);
}

.toracles-candidate2 .c2-card__identity--neutral {
  color: var(--c2-gold-base);
}

/* ==========================================================================
   20. Fase 5 — Fidelidad visual del módulo toracles-anatomia embebido
   Integra la anatomía interactiva en CANDIDATE2 sin afectar la landing
   standalone del plugin. Scope estricto: Home CANDIDATE2 + shortcode embedded.
   ========================================================================== */
.toracles-candidate2 .c2-section--phase4 {
  padding-block: clamp(34px, 4.1vw, 50px);
}

.toracles-candidate2 .c2-section--phase4 .c2-dissector-head {
  max-width: 920px;
  margin-inline: auto;
  margin-bottom: clamp(24px, 3vw, 34px);
}

.toracles-candidate2 .c2-section--phase4 .c2-dissector-head .c2-section-title {
  max-width: 20ch;
  font-size: clamp(38px, 4.3vw, 52px);
  line-height: 0.98;
}

.toracles-candidate2 .c2-section--phase4 .c2-dissector-head .c2-lead {
  max-width: 56ch;
  margin-inline: auto;
}

.toracles-candidate2 .toracles-embedded-module {
  min-height: 0;
  background:
    radial-gradient(760px 420px at 78% 6%, rgba(44, 61, 92, 0.18), transparent 68%),
    linear-gradient(180deg, rgba(13, 14, 18, 0.74), rgba(10, 10, 12, 0.18));
  border: 1px solid var(--c2-gold-border-subtle);
  box-shadow: 0 22px 80px rgba(0, 0, 0, 0.2);
}

.toracles-candidate2 .toracles-embedded-module .dissector,
.toracles-candidate2 .toracles-embedded-module .notebook,
.toracles-candidate2 .toracles-embedded-module .market {
  width: min(100% - 40px, 1120px);
  padding-block: clamp(42px, 5vw, 58px);
  margin-inline: auto;
}

.toracles-candidate2 .toracles-embedded-module .dissector + .notebook,
.toracles-candidate2 .toracles-embedded-module .notebook + .market {
  border-top: 1px solid var(--c2-gold-border-subtle);
}

.toracles-candidate2 .toracles-embedded-module .section-heading {
  max-width: 720px;
  margin-bottom: clamp(24px, 3vw, 34px);
}

.toracles-candidate2 .toracles-embedded-module .section-heading h2 {
  font-family: var(--c2-font-display);
  font-size: clamp(34px, 4.2vw, 54px);
  line-height: 1.02;
  color: var(--c2-text-heading);
  text-wrap: balance;
}

.toracles-candidate2 .toracles-embedded-module .section-label,
.toracles-candidate2 .toracles-embedded-module .eyebrow,
.toracles-candidate2 .toracles-embedded-module .step-counter,
.toracles-candidate2 .toracles-embedded-module .market-status,
.toracles-candidate2 .toracles-embedded-module .storage-status {
  font-family: var(--c2-font-mono);
}

.toracles-candidate2 .toracles-embedded-module .piece-grid {
  gap: clamp(14px, 1.8vw, 22px);
}

.toracles-candidate2 .toracles-embedded-module .piece-card,
.toracles-candidate2 .toracles-embedded-module .reading-panel,
.toracles-candidate2 .toracles-embedded-module .step-panel,
.toracles-candidate2 .toracles-embedded-module .condition-box,
.toracles-candidate2 .toracles-embedded-module .note-writer,
.toracles-candidate2 .toracles-embedded-module .saved-notes,
.toracles-candidate2 .toracles-embedded-module .series-progress,
.toracles-candidate2 .toracles-embedded-module .market-box {
  border-color: var(--c2-gold-border);
  background: var(--c2-bg-section-card);
}

.toracles-candidate2 .toracles-embedded-module .reading-panel,
.toracles-candidate2 .toracles-embedded-module .step-panel,
.toracles-candidate2 .toracles-embedded-module .condition-box,
.toracles-candidate2 .toracles-embedded-module .note-writer,
.toracles-candidate2 .toracles-embedded-module .saved-notes,
.toracles-candidate2 .toracles-embedded-module .series-progress,
.toracles-candidate2 .toracles-embedded-module .market-box {
  padding: clamp(20px, 2.4vw, 26px);
}

@media (max-width: 840px) {
  .toracles-candidate2 .toracles-embedded-module .dissector,
  .toracles-candidate2 .toracles-embedded-module .notebook,
  .toracles-candidate2 .toracles-embedded-module .market {
    width: min(100% - 24px, 1120px);
    padding-block: 40px;
  }

  .toracles-candidate2 .c2-section--phase4 .c2-dissector-head .c2-section-title,
  .toracles-candidate2 .toracles-embedded-module .section-heading h2 {
    font-size: clamp(34px, 11vw, 48px);
  }
}

/* ==========================================================================
   21. Tooltip de carta Scryfall (CANDIDATE2 - Tarea B)
   ========================================================================== */
.c2-cardtip {
  position: absolute;
  z-index: 9999;
  max-width: 180px;
  padding: 8px;
  background: var(--c2-bg-section-card, #0d0d10);
  border: 1px solid var(--c2-gold-border-strong, rgba(205, 176, 122, 0.35));
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.55);
  pointer-events: none; /* no roba el hover al enlace */
}

.c2-cardtip[hidden] {
  display: none;
}

.c2-cardtip img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 6px;
}

.c2-cardtip__meta {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.3;
}

.c2-cardtip__meta strong {
  display: block;
  color: var(--c2-text-heading, #f6efe0);
}

.c2-cardtip__meta span {
  color: var(--c2-gold-base, #cdb07a);
}

@media (prefers-reduced-motion: no-preference) {
  .c2-cardtip {
    transition: opacity 0.12s ease;
  }
}

/* ==========================================================================
   19. DETALLE COMMANDER CANÓNICO V2 (.section-detail, .detail-index, etc.)
   Scope estricto bajo .toracles-candidate2. Reutiliza variables canónicas.
   ========================================================================== */
.toracles-candidate2.single-commander-v2,
.toracles-candidate2 .section-detail {
  box-sizing: border-box;
}

.toracles-candidate2 .section-detail {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(22px, 5vw, 48px);
  padding: 0 0 clamp(42px, 6vw, 82px);
  width: min(var(--max-width, 1180px), calc(100% - 32px));
  margin: 0 auto;
}

@media (max-width: 900px) {
  .toracles-candidate2 .section-detail {
    grid-template-columns: 1fr;
  }

  /* En móvil el índice no puede quedarse sticky: tapa el contenido al hacer scroll. */
  .toracles-candidate2 .detail-index {
    position: static;
    top: auto;
    width: 100%;
  }
}

.toracles-candidate2 .detail-index {
  position: sticky;
  top: 92px;
  align-self: start;
  border: 1px solid var(--c2-gold-border, rgba(205, 176, 122, 0.16));
  background: var(--c2-bg-section-card, #0d0d10);
  padding: 20px;
  border-radius: var(--c2-radius-card, 4px);
}

.toracles-candidate2 .detail-index h2 {
  margin: 0 0 12px;
  color: var(--c2-gold-base, #cdb07a);
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.toracles-candidate2 .detail-index a {
  display: block;
  min-height: 44px;
  padding: 10px 12px;
  color: var(--c2-text-body, #ded7c8);
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.85rem;
  text-decoration: none;
  border-left: 2px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

.toracles-candidate2 .detail-index a:hover,
.toracles-candidate2 .detail-index a:focus-visible {
  color: var(--c2-gold-light, #f0e2c0);
  border-left-color: var(--c2-gold-base, #cdb07a);
  background: rgba(205, 176, 122, 0.05);
}

.toracles-candidate2 .detail-stack {
  display: grid;
  gap: 20px;
}

.toracles-candidate2 .detail-block {
  border: 1px solid var(--c2-gold-border, rgba(205, 176, 122, 0.16));
  background: var(--c2-bg-section-card, #0d0d10);
  padding: clamp(20px, 3vw, 32px);
  border-radius: var(--c2-radius-card, 4px);
  color: var(--c2-text-body, #ded7c8);
}

.toracles-candidate2 .detail-block h2 {
  margin: 0 0 16px;
  color: var(--c2-text-heading, #f6efe0);
  font-family: var(--c2-font-serif, "Toracles Fell", Georgia, serif);
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 400;
  line-height: 1.15;
}

.toracles-candidate2 .detail-block h3 {
  margin: 20px 0 8px;
  color: var(--c2-gold-base, #cdb07a);
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 1.1rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.toracles-candidate2 .detail-block p {
  margin: 0 0 14px;
  line-height: 1.6;
}

.toracles-candidate2 .detail-block p:last-child {
  margin-bottom: 0;
}

.toracles-candidate2 .detail-block .detail-block-intro {
  color: var(--c2-text-muted, #9d9689);
  font-size: 0.95rem;
  margin-bottom: 18px;
}

/* Specs en bloque 1 */
.toracles-candidate2 .c2-commander-specs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin: 16px 0;
}

.toracles-candidate2 .c2-spec-item {
  border: 1px solid var(--c2-gold-border-subtle, rgba(205, 176, 122, 0.09));
  background: rgba(10, 10, 12, 0.6);
  padding: 12px 14px;
  border-radius: var(--c2-radius-btn, 3px);
}

.toracles-candidate2 .c2-spec-label {
  display: block;
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.7rem;
  color: var(--c2-text-muted, #9d9689);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 6px;
}

.toracles-candidate2 .c2-spec-value {
  display: block;
  min-height: 1.25em;
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.95rem;
  line-height: 1.35;
  color: var(--c2-text-heading, #f6efe0) !important;
  font-weight: 600;
}

.toracles-candidate2 .c2-color-identity-pills {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}

.toracles-candidate2 .c2-color-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.72rem;
  font-weight: 700;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.toracles-candidate2 .c2-color-pill--w { background: #f8f6d8; color: #201a0e; }
.toracles-candidate2 .c2-color-pill--u { background: #0e68ab; color: #fff; }
.toracles-candidate2 .c2-color-pill--b { background: #211e1f; color: #ccc; border-color: #555; }
.toracles-candidate2 .c2-color-pill--r { background: #d3202a; color: #fff; }
.toracles-candidate2 .c2-color-pill--g { background: #00733e; color: #fff; }

/* Selector de prioridades */
.toracles-candidate2 .priority-selector {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 16px 0;
}

.toracles-candidate2 .priority-selector button {
  min-height: 44px;
  padding: 8px 18px;
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  cursor: pointer;
  border: 1px solid var(--c2-gold-border, rgba(205, 176, 122, 0.16));
  background: rgba(10, 10, 12, 0.7);
  color: var(--c2-text-body, #ded7c8);
  border-radius: var(--c2-radius-btn, 3px);
  transition: all 0.15s ease;
}

.toracles-candidate2 .priority-selector button:hover,
.toracles-candidate2 .priority-selector button:focus-visible {
  border-color: var(--c2-gold-base, #cdb07a);
  color: var(--c2-gold-light, #f0e2c0);
  background: rgba(205, 176, 122, 0.08);
}

.toracles-candidate2 .priority-selector button[aria-pressed="true"] {
  border-color: var(--c2-gold-base, #cdb07a);
  background: var(--c2-gold-base, #cdb07a);
  color: #0a0a0c;
  font-weight: 700;
}

.toracles-candidate2 .recommendation-box {
  border-left: 3px solid var(--c2-gold-base, #cdb07a);
  background: rgba(205, 176, 122, 0.05);
  padding: 14px 18px;
  margin: 14px 0 0;
  color: var(--c2-text-body, #ded7c8);
  font-size: 0.95rem;
  line-height: 1.6;
}

/* Bloque Combos */
.toracles-candidate2 .c2-combos-grid {
  display: grid;
  gap: 16px;
  margin-top: 18px;
}

.toracles-candidate2 .c2-combo-card {
  border: 1px solid var(--c2-gold-border-subtle, rgba(205, 176, 122, 0.09));
  background: rgba(10, 10, 12, 0.6);
  padding: 18px 20px;
  border-radius: var(--c2-radius-card, 4px);
}

.toracles-candidate2 .c2-combo-card:hover {
  border-color: var(--c2-gold-border-soft, rgba(205, 176, 122, 0.18));
}

.toracles-candidate2 .c2-combo-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.75rem;
}

.toracles-candidate2 .c2-combo-id {
  color: var(--c2-text-dim, #6e685c);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.toracles-candidate2 .c2-combo-popularity {
  color: var(--c2-gold-base, #cdb07a);
  background: rgba(205, 176, 122, 0.08);
  padding: 3px 8px;
  border-radius: 2px;
  font-weight: 600;
}

.toracles-candidate2 .c2-combo-cards-heading {
  margin: 0 0 10px;
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 1rem;
  color: var(--c2-text-heading, #f6efe0);
  line-height: 1.4;
}

.toracles-candidate2 .c2-combo-cards-heading a.deckbox_link {
  color: var(--c2-gold-light, #f0e2c0);
  text-decoration: underline;
  text-decoration-color: var(--c2-gold-border, rgba(205, 176, 122, 0.3));
}

.toracles-candidate2 .c2-combo-cards-heading a.deckbox_link:hover {
  color: var(--c2-gold-base, #cdb07a);
  text-decoration-color: var(--c2-gold-base, #cdb07a);
}

.toracles-candidate2 .c2-combo-results-title {
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--c2-text-muted, #9d9689);
  margin: 12px 0 6px;
}

.toracles-candidate2 .c2-combo-results {
  margin: 0 0 12px;
  padding-left: 18px;
  list-style-type: disc;
}

.toracles-candidate2 .c2-combo-results li {
  font-size: 0.88rem;
  color: var(--c2-text-body, #ded7c8);
  margin-bottom: 3px;
  line-height: 1.4;
}

.toracles-candidate2 .c2-combo-desc {
  font-size: 0.85rem;
  color: var(--c2-text-muted, #9d9689);
  line-height: 1.5;
  border-top: 1px dashed var(--c2-gold-border-subtle, rgba(205, 176, 122, 0.09));
  padding-top: 10px;
  margin-top: 10px;
}

/* Bloque Mercado */
.toracles-candidate2 .c2-market-banner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  background: rgba(205, 176, 122, 0.05);
  border: 1px solid var(--c2-gold-border-soft, rgba(205, 176, 122, 0.18));
  padding: 10px 16px;
  border-radius: var(--c2-radius-btn, 3px);
  margin-bottom: 18px;
}

.toracles-candidate2 .c2-market-badge {
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--c2-gold-base, #cdb07a);
  font-weight: 700;
}

.toracles-candidate2 .c2-market-date {
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.75rem;
  color: var(--c2-text-muted, #9d9689);
}

.toracles-candidate2 .c2-market-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}

.toracles-candidate2 .c2-market-card {
  border: 1px solid var(--c2-gold-border-subtle, rgba(205, 176, 122, 0.09));
  background: rgba(10, 10, 12, 0.6);
  padding: 16px 18px;
  border-radius: var(--c2-radius-card, 4px);
}

.toracles-candidate2 .c2-market-card-title {
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.85rem;
  color: var(--c2-gold-light, #f0e2c0);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 12px;
}

.toracles-candidate2 .c2-market-prices {
  display: grid;
  gap: 6px;
}

.toracles-candidate2 .c2-market-price-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.85rem;
}

.toracles-candidate2 .c2-market-price-label {
  color: var(--c2-text-muted, #9d9689);
}

.toracles-candidate2 .c2-market-price-val {
  color: var(--c2-text-heading, #f6efe0);
  font-weight: 700;
  font-size: 1rem;
}

.toracles-candidate2 .c2-market-price-val--foil {
  color: var(--c2-gold-base, #cdb07a);
}

/* Footer nav */
.toracles-candidate2 .section-footer-nav {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  width: min(var(--max-width, 1180px), calc(100% - 32px));
  margin: 24px auto 0;
}

.toracles-candidate2 .section-footer-nav .c2-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 22px;
  font-family: var(--c2-font-mono, ui-monospace, monospace);
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  text-decoration: none;
  border: 1px solid var(--c2-gold-border, rgba(205, 176, 122, 0.16));
  background: var(--c2-bg-section-card, #0d0d10);
  color: var(--c2-text-heading, #f6efe0);
  border-radius: var(--c2-radius-btn, 3px);
  transition: all 0.15s ease;
}

.toracles-candidate2 .section-footer-nav .c2-btn:hover,
.toracles-candidate2 .section-footer-nav .c2-btn:focus-visible {
  border-color: var(--c2-gold-base, #cdb07a);
  background: rgba(205, 176, 122, 0.08);
  color: var(--c2-gold-light, #f0e2c0);
}



/* Producción: ocultar rótulos de maqueta local (solo visibles en WP_LOCAL_DEV). */
body:not(.toracles-local-dev) .c2-badge--mock,
body:not(.toracles-local-dev) .c2-hero__mock,
body:not(.toracles-local-dev) .c2-live__notice,
body:not(.toracles-local-dev) .c2-section-label__mock,
body:not(.toracles-local-dev) .c2-newsletter__badge--mock { display: none !important; }

/* En móvil el índice debe fluir con el artículo y nunca tapar el texto. */
@media (max-width: 900px) {
  .toracles-candidate2.single-commander-v2 .detail-index {
    position: static !important;
    top: auto !important;
    width: 100%;
  }
}