:root {
  /* === Color tokens (paleta canónica — premium audit Apr 2026) ===
   * Fondo sólido oscuro premium (no gradient saturado). Surfaces sólidos.
   * Una sola escala azul canónica + gold premium para M90.
   */
  --bg-base: #0a1530;          /* deep navy sólido */
  --bg-accent: #0e1b3d;         /* leve variación radial */
  --bg-start: var(--bg-base);   /* legacy alias */
  --bg-end: var(--bg-accent);   /* legacy alias */
  --surface: #ffffff;           /* sólido, sin transparencia que lava */
  --surface-strong: #ffffff;
  --surface-elevated: #ffffff;
  --surface-tint: #f7f9fc;      /* tono frío sutil para zonas internas */
  --ink: #0b1430;               /* casi negro azulado, mayor contraste */
  --ink-soft: #3a4a6a;
  --ink-mute: #5a6b88;
  --ink-mute-dark: #b4bfcf;    /* muted text on dark backgrounds (5.2:1 on #1e1e2e) */
  --line: rgba(11, 20, 48, 0.10);
  --line-soft: rgba(11, 20, 48, 0.06);
  --line-strong: #e2e8f0;       /* línea visible (timelines, separadores prominentes) */
  --primary: #2563eb;
  --primary-strong: #1d4ed8;
  --primary-soft: rgba(37, 99, 235, 0.08);
  --indigo: #4f46e5;
  --indigo-strong: #4338ca;
  --success: #0f9d74;
  --success-soft: rgba(15, 157, 116, 0.1);
  --info-soft: rgba(37, 99, 235, 0.09);
  --warning: #d97706;
  --warning-soft: rgba(217, 119, 6, 0.12);
  --danger: #dc2626;
  --gold: #f59e0b;
  --gold-strong: #d97706;
  --gold-soft: rgba(245, 158, 11, 0.12);

  /* === Radius tokens === */
  --radius-xl: 20px;
  --radius-lg: 14px;
  --radius-md: 10px;
  --radius-sm: 6px;
  --radius-pill: 999px;

  /* === Shadow tokens (4 niveles + glow) === */
  --shadow-sm: 0 1px 2px rgba(2, 6, 23, 0.06);
  --shadow-md: 0 10px 26px rgba(2, 6, 23, 0.12);
  --shadow-lg: 0 18px 45px rgba(2, 6, 23, 0.16);
  --shadow-xl: 0 30px 80px rgba(2, 6, 23, 0.24);
  --shadow-glow-indigo: 0 0 0 1px rgba(79, 70, 229, 0.18), 0 16px 40px -12px rgba(79, 70, 229, 0.45);
  --shadow-glow-gold: 0 0 0 1px rgba(245, 158, 11, 0.22), 0 18px 50px -16px rgba(245, 158, 11, 0.55);

  /* === Space scale ===
   * IMPORTANTE: --space-1..--space-6 se PRESERVAN con sus valores legacy
   * (6/10/14/18/24/32) porque 86+ clases del CSS legacy ya los usan.
   * Cambiarlos colapsa el spacing global. Solo se AÑADEN --space-7/--space-8.
   */
  --space-px: 2px;
  --space-0: 4px;
  --space-1: 6px;
  --space-1h: 8px;
  --space-2: 10px;
  --space-2h: 12px;
  --space-3: 14px;
  --space-3h: 16px;
  --space-4: 18px;
  --space-4h: 20px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* === Typography scale (modular 1.125 base 15px) === */
  --text-xs: 0.72rem;     /* 11.5px */
  --text-xs-plus: 0.75rem; /* 12px — absorbs 0.75-0.78rem gap */
  --text-sm: 0.81rem;     /* 13px */
  --text-body: 0.875rem;  /* 14px — absorbs 0.85-0.88rem gap */
  --text-base: 0.9375rem; /* 15px */
  --text-md: 1rem;        /* 16px */
  --text-lg: 1.125rem;    /* 18px */
  --text-xl: 1.266rem;    /* ~20px */
  --text-2xl: 1.424rem;   /* ~22.8px */
  --text-3xl: 1.602rem;
  --text-4xl: 1.802rem;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semi: 600;
  --weight-bold: 700;
  --weight-black: 800;

  /* === Z-Index layers (audit 2026-04-10) ===
   * Sistema de capas ordenado para evitar que modals se pisen.
   * Nunca usar números sueltos — solo estas variables.
   */
  --z-nav: 900;
  --z-sticky: 990;
  --z-dropdown: 1000;
  --z-overlay: 1100;
  --z-modal: 1200;
  --z-notification: 1300;
  --z-celebration: 1400;
  --z-tooltip: 1500;
  --z-premium-overlay: 9000;   /* weekly-review overlay — sprint30 premium, above tooltip */
  --z-premium-celebration: 9999; /* pattern-broken celebration — full-screen, topmost */
  --z-base: 0;
  --z-local: 1;
  --z-above: 2;
  --z-float: 10;

  /* === Breakpoints (canonical — 5 values max) ===
   * @media queries must use only these values.
   * Tokens for documentation; raw px in @media (CSS vars not allowed there).
   */
  --bp-xs: 420px;
  --bp-sm: 480px;
  --bp-md: 640px;
  --bp-lg: 768px;
  --bp-xl: 1024px;

  /* === Motion === */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast: 120ms;
  --t-base: 220ms;
  --t-slow: 360ms;

  /* === TODAY ZONES — flat layout (audit 2026-04-09) ===
   * El dashboard "Today" se reduce a 4 macrozonas planas separadas por
   * ritmo vertical en lugar de cards anidadas con backgrounds y borders.
   * UN solo accent color por sesion segun la fase operativa
   * (--phase-color, heredado por todos los hijos del .plan-card.phase-FN).
   * Los acentos por rol son: info (diagnostico), action (mision = phase),
   * input (evidencia). Sin gradients, sin shimmer, sin shadows internas.
   */
  --zone-info: #4f46e5;
  --zone-action: var(--phase-color, #2563eb);
  --zone-input: #10b981;
  --zone-muted: rgba(11, 20, 48, 0.55);
  --zone-divider: rgba(11, 20, 48, 0.08);
  --phase-color: #2563eb;
  --zone-rhythm: 32px;
  --zone-rhythm-mobile: 24px;

  /* === Phase palette (single source of truth — audit UX 2026-04-16) ===
   * Colores canónicos F1-F9. Usados por .plan-card.phase-FN (border),
   * .phase-badge.phase-FN (background) y .history-phase-band (accent).
   * Cambiar un color aquí lo propaga a los 3 contextos.
   */
  --phase-F1: #14b8a6;  /* teal — F1 Dirección */
  --phase-F2: #8b5cf6;  /* violet — F2 Oferta */
  --phase-F3: #06b6d4;  /* cyan — F3 Canal */
  --phase-F4: #f59e0b;  /* amber — F4 Conversión */
  --phase-F5: #10b981;  /* emerald — F5 Entrega */
  --phase-F6: #6366f1;  /* indigo — F6 M90 */
  --phase-F7: #d946ef;  /* fuchsia — F7 M90 */
  --phase-F8: #ec4899;  /* pink — F8 M90 */
  --phase-F9: #f97316;  /* orange — F9 M90 */

  /* === Chip tokens (audit UX 2026-04-16) ===
   * Backgrounds para .rn-step y variantes. Reemplazan hex inline en renders.
   */
  --chip-neutral: #f8fafc;
  --chip-info: #eff6ff;
  --warning-deep: #92400e;  /* amber-800 — razón de pivot sobre fondo claro */
}

* {
  box-sizing: border-box;
}

/* === Utility classes — semantic color (audit UX 2026-04-13) === */
.u-text-primary { color: var(--primary) !important; }
.u-text-success { color: var(--success) !important; }
.u-text-danger { color: var(--danger) !important; }
.u-text-warning { color: var(--warning) !important; }
.u-text-gold { color: var(--gold) !important; }
.u-text-ink { color: var(--ink) !important; }
.u-text-soft { color: var(--ink-soft) !important; }
.u-text-mute { color: var(--ink-mute) !important; }
.u-text-indigo { color: #6366f1 !important; }
.u-text-emerald { color: #10b981 !important; }
.u-text-rose { color: #ef4444 !important; }
.u-text-amber { color: #f59e0b !important; }
.u-text-cyan { color: #06b6d4 !important; }
.u-text-violet { color: #8b5cf6 !important; }
.u-bg-primary-soft { background: var(--primary-soft) !important; }
.u-bg-success-soft { background: var(--success-soft) !important; }
.u-bg-warning-soft { background: var(--warning-soft) !important; }

html,
body {
  margin: 0;
  width: 100%;
  min-height: 100%;
  overflow-x: hidden;
  /* Fondo base también en <html> para que el lienzo previo al render sea navy
     (no blanco) y no haya flash blanco mientras carga el CSS/JS. */
  background-color: var(--bg-base);
}

body {
  font-family: "Inter", "Segoe UI", sans-serif;
  color: var(--ink);
  /* Fondo premium: navy sólido + radial accent sutil (sin gradient saturado lineal) */
  background:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(99, 102, 241, 0.10), transparent 60%),
    radial-gradient(ellipse 60% 40% at 100% 100%, rgba(37, 99, 235, 0.08), transparent 60%),
    var(--bg-base);
  background-attachment: fixed;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#particles-js {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: var(--z-base);
  /* Reducido: el grafo de partículas se veía templatey. Casi imperceptible ahora. */
  opacity: 0.18;
  pointer-events: none;
}

#particles-js canvas {
  width: 100% !important;
  height: 100% !important;
  display: block;
}

.el-foreground {
  position: relative;
  z-index: var(--z-local);
}

.hidden {
  display: none !important;
}

.container {
  width: min(980px, calc(100% - 28px));
  min-height: calc(100dvh - 28px);
  margin: var(--space-3) auto;
  padding: var(--space-6) clamp(16px, 3.5vw, 30px);
  border-radius: 24px;
  background: var(--surface);
  box-shadow: 0 24px 60px -12px rgba(2, 6, 23, 0.45),
              0 8px 24px -8px rgba(2, 6, 23, 0.25);
}

/* Auth mode: container actúa como BACKDROP transparente para que las cards sean
 * los protagonistas. Sin surface lavada — el premium feeling viene de cards
 * sólidas sobre fondo navy puro. */
.container.auth-mode {
  background: transparent;
  box-shadow: none;
  padding-top: var(--space-7);
}

.logo-wrapper {
  text-align: center;
  margin-bottom: var(--space-1h);
}

.logo-img {
  width: min(220px, 60vw);
  height: auto;
}

/* En auth-mode el fondo es navy oscuro: drop-shadow para resaltar el logo
 * sobre el navy. El logo real de marca ya tiene colores correctos sobre
 * fondo oscuro, así que NO invertimos (brightness/invert dejarían un
 * cuadrado blanco). */
.container.auth-mode .logo-img {
  filter: drop-shadow(0 4px 18px rgba(99, 102, 241, 0.45));
  width: min(180px, 50vw);
}

.logo-title {
  margin: var(--space-1) 0 var(--space-2);
  text-align: center;
  font-size: clamp(1.65rem, 2.8vw, 2.1rem);
  font-weight: 800;
  letter-spacing: -0.015em;
  color: #0b2a69;
}

.subtitulo {
  margin: 0 auto var(--space-5);
  max-width: 540px;
  text-align: center;
  color: var(--ink-soft);
  font-size: 0.99rem;
  font-weight: 500;
}

/* En auth-mode el header flota sobre fondo navy → texto blanco con jerarquía clara */
.container.auth-mode .logo-title {
  color: #ffffff;
  font-size: clamp(1.85rem, 3.2vw, 2.4rem);
  letter-spacing: -0.02em;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
}

/* En dashboard mode (no auth), reducir el header de marca: el dashboard tiene
 * su propio "welcome user" que actúa como header del producto. El logo + título
 * pasa a ser un branding sutil arriba, no compite con el contenido. */
.container:not(.auth-mode) .logo-wrapper {
  margin-bottom: 0;
}
.container:not(.auth-mode) .logo-img {
  width: min(120px, 32vw);
}
.container:not(.auth-mode) .logo-title {
  font-size: clamp(1rem, 1.6vw, 1.15rem);
  font-weight: 700;
  color: var(--ink-soft);
  margin: var(--space-px) 0;
}
.container:not(.auth-mode) .lang-toggle {
  font-size: var(--text-xs);
}
.container:not(.auth-mode) .subtitulo {
  display: none;  /* el welcome del dashboard es la verdadera "frase de bienvenida" */
}

.container.auth-mode .subtitulo {
  color: rgba(255, 255, 255, 0.78);
  font-weight: 500;
  font-size: var(--text-md);
}

.container.auth-mode .lang-toggle button {
  color: rgba(255, 255, 255, 0.65);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
}
.container.auth-mode .lang-toggle button.active {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.35);
}

/* ===== AUTH SHELL (login / registro / recuperar / contexto) ===== */

.auth-shell {
  max-width: 660px;
  margin: 0 auto;
  padding-top: var(--space-1h);
}

.auth-card {
  background: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: var(--radius-xl);
  box-shadow:
    0 28px 70px -12px rgba(0, 0, 0, 0.45),
    0 12px 28px -8px rgba(0, 0, 0, 0.22);
  overflow: hidden;
}

.auth-card--register {
  max-width: 640px;
}

.auth-card-header {
  padding: 34px 34px 22px;
  text-align: center;
  background: #fafbfd;
  border-bottom: 1px solid rgba(11, 20, 48, 0.06);
}

.auth-title {
  margin: 0 0 6px;
  font-size: var(--text-2xl);
  font-weight: 800;
  color: #0b2a69;
  letter-spacing: -0.02em;
}

.auth-subtitle {
  margin: 0;
  color: #4a6494;
  font-size: var(--text-base);
  line-height: 1.45;
}

.auth-card-body {
  padding: 28px 32px 32px;
}

.auth-field {
  margin-bottom: var(--space-4);
}

.auth-label {
  display: block;
  margin-bottom: 7px;
  font-size: var(--text-sm);
  font-weight: 680;
  color: #1e3a6e;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.auth-field input {
  border: 1.5px solid rgba(15, 23, 42, 0.13);
  border-radius: 11px;
  padding: 13px 14px;
  font-size: var(--text-base);
  background: #fdfdff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.auth-field input:focus {
  border-color: rgba(37, 99, 235, 0.5);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
  background: #fff;
}

.auth-field input::placeholder {
  color: #94a3c4;
}

.auth-credentials-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3h);
  margin-bottom: var(--space-1);
}

.auth-cta {
  width: 100%;
  margin-top: var(--space-1);
  padding: var(--space-3) var(--space-3h);
  font-size: var(--text-md);
  font-weight: 750;
  border-radius: 12px;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #fff;
  box-shadow: 0 8px 24px rgba(37, 99, 235, 0.28);
  transition: transform 0.15s ease, box-shadow 0.2s ease;
  letter-spacing: 0.01em;
}

.auth-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(37, 99, 235, 0.35);
  background: linear-gradient(135deg, #1d4ed8, #1740a0);
}

.auth-links {
  margin-top: var(--space-4h);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  font-size: var(--text-body);
}

.auth-links a {
  color: #3068d8;
  font-weight: 620;
  text-decoration: none;
  transition: color 0.15s;
}

.auth-links a:hover {
  color: #1740a0;
  text-decoration: underline;
}

.auth-links-sep {
  width: var(--space-0);
  height: var(--space-0);
  border-radius: 50%;
  background: #c4d0e8;
  flex-shrink: 0;
}

.auth-back-link {
  display: block;
  width: fit-content;
  margin: var(--space-4h) auto 0;
  background: transparent;
  color: #6b82ab;
  font-weight: 640;
  font-size: var(--text-body);
  padding: var(--space-1h) var(--space-4);
  box-shadow: none;
  border: 1px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}

.auth-back-link:hover {
  color: var(--primary);
  background: transparent;
  border-color: rgba(37, 99, 235, 0.15);
}

.auth-recover-actions {
  display: flex;
  gap: var(--space-2h);
  margin-top: var(--space-1);
}

.auth-recover-actions button {
  flex: 1;
}

/* Legacy compat */
.formulario-centro {
  display: grid;
  gap: var(--space-2);
}

.formulario-centro p {
  margin: 0;
  text-align: center;
  color: var(--ink-soft);
  font-size: var(--text-base);
}

.formulario-centro a {
  color: #1d4ed8;
  font-weight: 600;
  text-decoration: none;
}

.formulario-centro a:hover {
  text-decoration: underline;
}

@media (max-width: 480px) {
  .auth-credentials-row {
    grid-template-columns: 1fr;
  }
  .auth-card-header {
    padding: var(--space-5) 22px var(--space-3h);
  }
  .auth-card-body {
    padding: 22px 22px 26px;
  }
  .auth-title {
    font-size: var(--text-xl);
  }
}

input,
textarea,
select {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  color: var(--ink);
  padding: var(--space-2h) 13px;
  font-size: var(--text-base);
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input:focus,
textarea:focus,
select:focus {
  border-color: rgba(37, 99, 235, 0.5);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

button {
  border: 0;
  border-radius: 12px;
  min-height: 44px;
  font-size: var(--text-base);
  font-weight: 650;
  padding: var(--space-2h) var(--space-3h);
  cursor: pointer;
  transition: transform 0.12s ease, box-shadow 0.2s ease, background 0.2s ease;
  background: var(--primary);
  color: #fff;
}

button:hover {
  background: var(--primary-strong);
  transform: translateY(-1px);
}

button:disabled {
  opacity: 0.58;
  cursor: not-allowed;
  transform: none;
}

.btn-primario {
  background: var(--primary);
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.25);
}

.btn-secundario {
  background: #e8efff;
  color: #143a8f;
}

.btn-secundario:hover {
  background: #d8e4ff;
}

/* ===== WIZARD / ONBOARDING PREMIUM ===== */

#wizardCard {
  margin-top: var(--space-4);
}

/* Wizard insight (between steps) */
.wizard-insight {
  background: linear-gradient(135deg, #1e1b4b, #312e81);
  color: #e0e7ff;
  padding: var(--space-3h) var(--space-4h);
  border-radius: 12px;
  margin: var(--space-2h) var(--space-3h);
  display: flex;
  align-items: center;
  gap: var(--space-2h);
  animation: insightFadeIn 0.5s ease;
}
.wizard-insight.hidden { display: none; }
.wizard-insight-icon { font-size: var(--text-4xl); flex-shrink: 0; }
.wizard-insight-text { font-size: var(--text-body); line-height: 1.5; font-weight: 500; }
@keyframes insightFadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

/* Wizard diagnostic (step 4) */
.wizard-diagnostico { padding: var(--space-0) 0; }
.wd-header { margin-bottom: var(--space-3); }
.wd-badge { display: inline-block; background: linear-gradient(135deg, #6366f1, #8b5cf6); color: #fff; padding: 4px var(--radius-lg); border-radius: var(--radius-xl); font-weight: 700; font-size: var(--text-sm); margin-bottom: var(--radius-sm); }
.wd-meta { font-size: var(--text-sm); color: #64748b; }
.wd-timeline { margin: var(--space-3) 0; }
.wd-timeline-title { font-weight: 700; font-size: var(--text-sm); color: #1e293b; margin-bottom: var(--space-2); }
.wd-timeline-track { position: relative; height: 60px; background: linear-gradient(90deg, #e0e7ff, #c7d2fe); border-radius: var(--radius-sm); padding: 0 8px; }
.wd-hito { position: absolute; top: var(--space-0); text-align: center; transform: translateX(-50%); }
.wd-hito-dot { width: var(--radius-md); height: var(--radius-md); background: #6366f1; border-radius: 50%; margin: 0 auto 2px; border: 2px solid #fff; box-shadow: 0 0 0 1px #6366f1; }
.wd-hito-label { font-size: 0.65rem; font-weight: 700; color: #4338ca; }
.wd-hito-text { font-size: 0.6rem; color: #475569; max-width: 70px; line-height: 1.2; }
.wd-objetivo { margin-top: var(--space-2h); font-size: var(--text-body); color: #1e293b; }
.wd-prediccion { margin-top: var(--space-2); font-size: var(--text-sm); color: #64748b; font-style: italic; }
.wd-m90-extra { margin-top: 12px; padding: var(--radius-md); background: linear-gradient(135deg, #1e1b4b, #312e81); border-radius: var(--radius-md); }
.wd-m90-badge { color: #fbbf24; font-weight: 800; font-size: var(--text-xs-plus); letter-spacing: 0.1em; margin-bottom: var(--space-1); }
.wd-m90-phases { display: flex; flex-direction: column; gap: var(--space-0); font-size: var(--text-xs-plus); color: #c4b5fd; }

/* Wizard Executive Summary (step 4 diagnostic report) */
.wizard-exec-summary {
  background: linear-gradient(135deg, #0f172a, #1e1b4b);
  color: #e0e7ff;
  padding: var(--space-4) var(--space-3h);
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-3h);
}
.wes-title {
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #a5b4fc;
  margin-bottom: var(--space-3);
  padding-bottom: var(--space-1h);
  border-bottom: 1px solid rgba(165,180,252,0.2);
}
.wes-section {
  margin-bottom: var(--space-2h);
  padding-left: var(--space-2h);
  border-left: 3px solid rgba(165,180,252,0.3);
}
.wes-section:last-child { margin-bottom: 0; }
.wes-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #818cf8;
  margin-bottom: 3px;
}
.wes-value {
  font-size: var(--text-sm);
  line-height: 1.5;
  color: #e0e7ff;
}
.wes-meta {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute-dark);
  margin-top: var(--space-0);
}
.wes-advantage { border-left-color: #34d399; }
.wes-advantage .wes-label { color: #34d399; }
.wes-blocker { border-left-color: #fb923c; }
.wes-blocker .wes-label { color: #fb923c; }
.wes-math { border-left-color: #fbbf24; }
.wes-math .wes-label { color: #fbbf24; }
.wes-math-value {
  font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
  font-size: var(--text-sm);
  color: #fde68a;
  font-weight: 600;
}

/* Plan Ideal (aspirational task ceiling) */
.task-tier-ideal {
  background: rgba(99,102,241,0.04);
  border: 1px dashed rgba(99,102,241,0.2);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-2);
  overflow: hidden;
}
.task-tier-ideal.collapsed .plan-ideal-body { display: none; }
.plan-ideal-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-2) var(--space-3);
  cursor: pointer;
  font-size: var(--text-sm);
  font-weight: 600;
  color: #6366f1;
}
.plan-ideal-toggle:hover { background: rgba(99,102,241,0.06); }
.plan-ideal-toggle::after {
  content: '▾';
  font-size: var(--text-xs);
  transition: transform 0.2s;
}
.task-tier-ideal.collapsed .plan-ideal-toggle::after { transform: rotate(-90deg); }
.plan-ideal-body { padding: 0 14px 12px; }
.plan-ideal-item {
  display: flex;
  align-items: center;
  gap: var(--space-1h);
  padding: var(--space-1) 0;
  font-size: var(--text-sm);
  color: #64748b;
  border-bottom: 1px solid rgba(0,0,0,0.04);
}
.plan-ideal-item:last-child { border-bottom: none; }
.plan-ideal-num {
  width: var(--space-4h);
  height: var(--space-4h);
  border-radius: 50%;
  background: rgba(99,102,241,0.1);
  color: #6366f1;
  font-size: 0.68rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.plan-ideal-impact {
  font-size: 0.65rem;
  font-weight: 600;
  padding: var(--space-px) var(--space-1);
  border-radius: 4px;
  flex-shrink: 0;
}
.plan-ideal-impact.alto { background: rgba(239,68,68,0.1); color: #ef4444; }
.plan-ideal-impact.medio { background: rgba(245,158,11,0.1); color: #f59e0b; }

/* Plan adapted note */
.plan-adapted-note {
  background: linear-gradient(90deg, rgba(99,102,241,0.06), transparent);
  border-left: 3px solid #6366f1;
  padding: var(--space-2) var(--space-3);
  margin: var(--space-1h) 0 var(--space-2h);
  font-size: var(--text-sm);
  color: #475569;
  line-height: 1.5;
  border-radius: 0 8px 8px 0;
}

/* Time budget bar */
.time-budget-bar {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-1h) var(--space-3);
  margin-bottom: var(--space-1h);
  font-size: var(--text-xs-plus);
  color: #64748b;
}
.time-budget-track {
  flex: 1;
  height: var(--space-1);
  background: #e2e8f0;
  border-radius: 3px;
  overflow: hidden;
}
.time-budget-fill {
  height: 100%;
  background: linear-gradient(90deg, #6366f1, #8b5cf6);
  border-radius: 3px;
  transition: width 0.3s;
}
.time-budget-label { font-weight: 600; white-space: nowrap; }

/* Goal Achievement Modal */
.goal-achieved-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,0.85);
  z-index: var(--z-modal);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4h);
  animation: fadeIn 0.3s ease;
}
.goal-achieved-card {
  background: linear-gradient(135deg, #1e1b4b, #312e81);
  color: #e0e7ff;
  padding: 28px 24px;
  border-radius: var(--radius-xl);
  max-width: 420px;
  width: 100%;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
  animation: insightFadeIn 0.5s ease;
}
.goal-achieved-icon { font-size: 3rem; margin-bottom: var(--space-2h); }
.goal-achieved-title {
  font-size: var(--text-xl);
  font-weight: 800;
  color: #fbbf24;
  margin-bottom: var(--space-1);
}
.goal-achieved-original {
  font-size: var(--text-body);
  color: #a5b4fc;
  margin-bottom: var(--space-0);
}
.goal-achieved-day {
  font-size: var(--text-md);
  font-weight: 700;
  color: #34d399;
  margin-bottom: var(--space-3h);
}
.goal-achieved-remaining {
  font-size: var(--text-body);
  color: #c7d2fe;
  margin-bottom: var(--space-4h);
}
.goal-achieved-question {
  font-size: var(--text-base);
  font-weight: 700;
  color: #fff;
  margin-bottom: var(--space-3);
}
.goal-achieved-options { display: flex; flex-direction: column; gap: var(--space-1h); }
.goal-achieved-option {
  padding: var(--space-2h) var(--space-3h);
  border-radius: var(--radius-md);
  font-size: var(--text-body);
  font-weight: 600;
  cursor: pointer;
  border: 1.5px solid rgba(165,180,252,0.3);
  background: rgba(255,255,255,0.05);
  color: #e0e7ff;
  transition: all 0.2s;
}
.goal-achieved-option:hover {
  background: rgba(99,102,241,0.2);
  border-color: #818cf8;
}
.goal-achieved-option.primary {
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #1e1b4b;
  border-color: transparent;
}
.goal-achieved-option.primary:hover { opacity: 0.9; }
.goal-achieved-input {
  width: 100%;
  padding: var(--space-2) var(--space-2h);
  background: rgba(255,255,255,0.1);
  border: 1.5px solid rgba(165,180,252,0.3);
  border-radius: 8px;
  color: #e0e7ff;
  font-size: var(--text-body);
  margin-top: var(--space-1h);
}
.goal-achieved-input::placeholder { color: rgba(165,180,252,0.5); }
.goal-achieved-input:focus {
  outline: none;
  border-color: #818cf8;
  box-shadow: 0 0 0 3px rgba(129, 140, 248, 0.18);
}

/* M90 Day 1 Strategic Insight (prominent) */
.m90-day1-insight {
  background: linear-gradient(135deg, #1e1b4b, #312e81);
  border: 1.5px solid rgba(251,191,36,0.3);
  border-radius: var(--radius-lg);
  padding: var(--space-3h) var(--space-4);
  margin: var(--space-2h) 0;
}
.m90-insight-badge {
  display: inline-block;
  background: linear-gradient(135deg, #fbbf24, #d97706);
  color: #1e1b4b;
  font-weight: 800;
  font-size: 0.65rem;
  padding: 3px 10px;
  border-radius: 12px;
  letter-spacing: 0.1em;
  margin-bottom: var(--space-1h);
}
.m90-insight-body {
  font-size: var(--text-body);
  line-height: 1.6;
  color: #e0e7ff;
  white-space: pre-line;
}

/* Quick wizard (3 questions, 1 screen) */
.wizard-quick {
  padding: var(--space-5) var(--space-4h);
  text-align: left;
}
.wizard-quick-title {
  font-size: var(--text-xl);
  font-weight: 800;
  color: #0f172a;
  margin-bottom: var(--space-0);
}
.wizard-quick-subtitle {
  font-size: var(--text-body);
  color: #64748b;
  margin-bottom: var(--space-4h);
  line-height: 1.4;
}
.wizard-quick-label {
  display: block;
  font-size: var(--text-body);
  font-weight: 700;
  color: #1e293b;
  margin: var(--space-3) 0 var(--space-1);
}
.wizard-quick-input {
  width: 100%;
  padding: var(--space-2) var(--space-2h);
  border: 1.5px solid #e2e8f0;
  border-radius: var(--radius-md);
  font-size: var(--text-body);
  resize: vertical;
  transition: border-color 0.2s;
}
.wizard-quick-input:focus {
  border-color: #6366f1;
  outline: none;
  box-shadow: 0 0 0 3px rgba(99,102,241,0.1);
}
.wizard-quick-submit {
  margin-top: var(--space-4h);
  width: 100%;
  padding: var(--space-3);
  font-size: var(--text-md);
  font-weight: 700;
}

/* Progressive question modal */
.pq-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15,23,42,0.6);
  backdrop-filter: blur(6px);
}
.pq-overlay.hidden { display: none; }
.pq-card {
  background: #fff;
  border-radius: 16px;
  padding: 28px 24px;
  max-width: 400px;
  width: 90%;
  box-shadow: 0 20px 50px rgba(0,0,0,0.2);
}
.pq-label {
  font-size: var(--text-base);
  font-weight: 700;
  color: #1e293b;
  margin-bottom: var(--space-2h);
  line-height: 1.4;
}
.pq-input {
  width: 100%;
  padding: var(--space-2) var(--space-2h);
  border: 1.5px solid #e2e8f0;
  border-radius: var(--radius-md);
  font-size: var(--text-body);
  margin-bottom: var(--space-3);
}
.pq-input:focus {
  border-color: #6366f1;
  outline: none;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.18);
}
.pq-actions { display: flex; gap: var(--space-1h); }
.pq-actions .btn-primario { flex: 1; }
.pq-actions .btn-secundario { flex: 0; white-space: nowrap; }

.wizard-card {
  width: min(680px, 100%);
  margin: 0 auto;
  border: 1.5px solid rgba(37, 99, 235, 0.12);
  border-radius: 22px;
  background: linear-gradient(165deg, #f8faff 0%, #ffffff 40%);
  padding: 0;
  box-shadow:
    0 12px 40px rgba(11, 31, 77, 0.10),
    0 2px 8px rgba(11, 31, 77, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.8);
  overflow: hidden;
}

.wizard-header {
  padding: 28px 28px 20px;
  background: linear-gradient(160deg, #eaf0ff 0%, #f0f5ff 50%, #f8faff 100%);
  border-bottom: 1px solid rgba(37, 99, 235, 0.1);
}

.wizard-title {
  margin: 0 0 4px;
  text-align: center;
  font-size: clamp(1.15rem, 2.4vw, 1.35rem);
  font-weight: 800;
  color: #0b2a69;
  letter-spacing: -0.01em;
}

.wizard-sub {
  margin: 0 0 20px;
  text-align: center;
  color: var(--ink-soft);
  font-size: var(--text-base);
  line-height: 1.4;
}

/* --- Stepper visual --- */
.wizard-stepper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: var(--space-3h);
}

.wizard-stepper-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-0);
  min-width: var(--space-7);
  opacity: 0.45;
  transition: opacity 0.25s ease, transform 0.2s ease;
}

.wizard-stepper-step.active {
  opacity: 1;
  transform: scale(1.05);
}

.wizard-stepper-step.completed {
  opacity: 0.85;
}

.stepper-num {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: var(--text-xs-plus);
  font-weight: 750;
  background: #e2eaff;
  color: #3060c0;
  border: var(--space-px) solid transparent;
  transition: all 0.25s ease;
}

.wizard-stepper-step.active .stepper-num {
  background: var(--primary);
  color: #fff;
  border-color: rgba(37, 99, 235, 0.3);
  box-shadow: 0 3px 12px rgba(37, 99, 235, 0.3);
}

.wizard-stepper-step.completed .stepper-num {
  background: var(--success);
  color: #fff;
}

.stepper-label {
  font-size: 0.68rem;
  font-weight: 650;
  color: #3c5a94;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.wizard-stepper-step.active .stepper-label {
  color: var(--primary-strong);
  font-weight: 750;
}

.wizard-stepper-line {
  flex: 1;
  max-width: var(--space-6);
  height: var(--space-px);
  background: #d4dfef;
  margin: 0 4px;
  margin-bottom: var(--space-4);
  border-radius: 2px;
}

/* --- Progress meter --- */
.wizard-meter {
  width: 100%;
  height: 5px;
  border-radius: 999px;
  background: rgba(37, 99, 235, 0.1);
  overflow: hidden;
}

.wizard-meter > span {
  display: block;
  height: 100%;
  width: 16.66%;
  border-radius: 999px;
  background: linear-gradient(90deg, #3b82f6, #1d4ed8);
  transition: width 0.35s ease;
}

/* --- Steps --- */
.wizard-step {
  padding: var(--space-5) 28px var(--space-1h);
}

.wizard-step-header {
  margin-bottom: var(--space-4h);
}

.wizard-step-title {
  margin: 0 0 4px;
  font-size: 1.08rem;
  font-weight: 750;
  color: #0f2d67;
}

.wizard-help {
  margin: 0;
  color: var(--ink-soft);
  font-size: var(--text-body);
  line-height: 1.4;
}

/* audit 2026-05-04: wizard-field-help para hints sutil en campos individuales */
.wizard-field-help {
  margin-top: 4px;
  color: #64748b;
  font-size: 11px;
  line-height: 1.35;
}

/* --- Field groups --- */
.wizard-field-group {
  margin-bottom: var(--space-3h);
}

.wizard-field-label {
  display: block;
  margin-bottom: var(--space-1);
  font-size: var(--text-sm);
  font-weight: 660;
  color: #1e3a6e;
  letter-spacing: 0.01em;
}

.wizard-optional {
  font-weight: 400;
  color: var(--ink-soft);
  font-size: var(--text-sm);
}

.wizard-textarea {
  min-height: 88px;
  margin: 0;
  border-radius: var(--radius-md);
  resize: vertical;
}

.wizard-textarea--sm {
  min-height: 56px;
}

.wizard-select {
  width: 100%;
  height: 46px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--ink);
  padding: var(--space-2) 13px;
  font-size: var(--text-base);
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' fill='none'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23475569' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}

.wizard-select:focus {
  border-color: rgba(37, 99, 235, 0.5);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}

select.wizard-textarea {
  min-height: 46px;
}

/* --- SMB plateau audit 2026-04-25: wizard SMB block (visible solo en etapas
       sistema/escala/plateau_establecido). Captura datos opcionales para
       diagnóstico de raíz del plateau. --- */
.wizard-smb-header {
  margin: var(--space-2) 0 var(--space-1h) 0;
  padding: var(--space-2);
  border-left: 3px solid #3b82f6;
  background: rgba(59, 130, 246, 0.06);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

.wizard-smb-header .wizard-help {
  margin: 0;
  font-size: var(--text-sm);
  color: #1e3a6e;
  line-height: 1.45;
}

.wizard-smb-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-3);
  margin-top: var(--space-1h);
}

.wizard-smb-field {
  display: flex;
  flex-direction: column;
}

.wizard-field-label--sm {
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 4px;
}

@media (max-width: 640px) {
  .wizard-smb-grid {
    grid-template-columns: 1fr;
  }
}

/* --- Dynamic zone (etapa-adaptive) --- */
.wizard-dynamic-zone {
  margin-top: var(--space-1h);
}

.wizard-dynamic-zone .wizard-field-group:last-child {
  margin-bottom: 0;
}

/* Etapa badge shown after selection */
.wizard-etapa-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  margin-top: var(--space-2);
  padding: var(--space-1) var(--space-3);
  border-radius: 999px;
  font-size: var(--text-sm);
  font-weight: 700;
  background: linear-gradient(135deg, #edf3ff, #f0f7ff);
  color: #1740a0;
  border: 1px solid rgba(37, 99, 235, 0.15);
}

/* --- Resumen --- */
.wizard-resumen-box {
  margin-top: var(--space-4h);
  padding: var(--space-3h);
  border-radius: 12px;
  border: 1px solid rgba(37, 99, 235, 0.1);
  background: linear-gradient(145deg, #f8faff, #f2f7ff);
}

.wizard-resumen-box h4 {
  margin: 0 0 8px;
  font-size: var(--text-body);
  font-weight: 700;
  color: #1e3a6e;
}

.wizard-resumen {
  margin: 0;
  white-space: pre-wrap;
  max-height: 200px;
  overflow: auto;
  color: #2e4576;
  font-size: var(--text-sm);
  line-height: 1.5;
}

/* --- Actions --- */
.wizard-actions {
  padding: var(--space-3h) 28px var(--space-5);
  display: flex;
  gap: var(--space-2h);
  flex-wrap: wrap;
}

.wizard-actions button {
  flex: 1;
  min-width: 130px;
  padding: 13px 16px;
  font-size: var(--text-base);
  font-weight: 700;
  border-radius: 12px;
}

.wizard-actions .btn-primario {
  box-shadow: 0 6px 18px rgba(37, 99, 235, 0.22);
}

/* =====================================================================
   FASE E (audit 2026-06-04) — capa visual premium del wizard.
   Aditiva y scopeada SOLO a selectores del wizard; no toca layout ni
   responsive. El ajuste fino se calibra al verlo corriendo (evidence pack).
   ===================================================================== */

/* Transición de entrada al cambiar de paso (fade + slide sutil) */
@keyframes wizardStepEnter {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.wizard-step:not(.hidden) {
  animation: wizardStepEnter 0.28s ease-out;
}

/* Focus premium consistente en TODOS los campos del wizard
   (el select ya lo tenía; input y textarea no) */
.wizard-input:focus,
.wizard-textarea:focus {
  border-color: rgba(37, 99, 235, 0.5);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
  outline: none;
}

/* Stepper: el paso completado muestra ✓ en lugar del número */
.wizard-stepper-step.completed .stepper-num {
  font-size: 0;
}

.wizard-stepper-step.completed .stepper-num::after {
  content: "✓";
  font-size: var(--text-xs-plus);
  font-weight: 800;
}

/* wizard-field-help refinado: es la columna vertebral del microcopy FASE D
   (el norte / la señal / la primera ficha del dominó) — merece legibilidad */
.wizard-field-help {
  margin-top: 6px;
  font-size: 11.5px;
  color: #5b6b85;
  padding-left: 9px;
  border-left: 2px solid rgba(37, 99, 235, 0.18);
}

/* Summary box premium: "Lo que tu mentor ya sabe de ti" */
.wizard-resumen-box {
  border-left: 3px solid rgba(37, 99, 235, 0.45);
  box-shadow: 0 4px 16px rgba(15, 45, 103, 0.05);
}

/* Microinteracción del CTA final del wizard */
.wizard-actions .btn-primario {
  transition: transform 0.15s ease, box-shadow 0.2s ease;
}

.wizard-actions .btn-primario:hover {
  transform: translateY(-1px);
  box-shadow: 0 9px 24px rgba(37, 99, 235, 0.3);
}

.wizard-actions .btn-primario:active {
  transform: translateY(0);
}

/* B (escalera): banner "Recuperamos lo que ya nos contaste" del quick */
.wizard-prefill-banner {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(16, 185, 129, 0.08);
  border: 1px solid rgba(16, 185, 129, 0.25);
  color: #065f46;
  font-size: 0.85rem;
  line-height: 1.4;
  animation: wizardStepEnter 0.28s ease-out;
}

.wizard-prefill-banner .wizard-prefill-icon {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--success, #10b981);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}

/* --- Responsive --- */
@media (max-width: 480px) {
  .wizard-step {
    padding: var(--space-4h) var(--space-4h) 6px;
  }
  .wizard-header {
    padding: 22px 20px 16px;
  }
  .wizard-actions {
    padding: var(--space-3) var(--space-4h) 22px;
  }
  .stepper-label {
    font-size: 0.6rem;
  }
  .stepper-num {
    width: 26px;
    height: 26px;
    font-size: var(--text-xs);
  }
  .wizard-stepper-line {
    max-width: var(--space-4h);
  }
}

@media (max-width: 420px) {
  .stepper-label {
    font-size: 0.55rem;
    max-width: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

#pantallaProgreso {
  margin-top: var(--space-2);
}

#planResult {
  margin-top: var(--space-3);
}

#progresoUsuario,
#centroOperacionBox,
#estadoDiaBox,
#mentorContextBox,
#deudaBox,
#emergenciaBox,
#evidenciaBox,
#diaAnteriorBox,
#historial {
  border: 1px solid var(--line-soft) !important;
  border-radius: var(--radius-lg) !important;
  background: var(--surface-strong) !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
}

#progresoUsuario {
  padding: var(--space-3) var(--space-3h);
  background: linear-gradient(145deg, #f2f8ff, #ffffff) !important;
  color: #0f2d67;
}

#centroOperacionBox {
  margin-top: var(--space-2h);
  padding: var(--space-3);
}

.co-header {
  display: flex;
  justify-content: space-between;
  gap: var(--space-2);
  align-items: flex-start;
  margin-bottom: var(--space-2);
}

.co-title {
  font-size: var(--text-md);
  font-weight: 800;
  color: #10306e;
}

.co-subtitle {
  font-size: var(--text-body);
  color: #3c5588;
  margin-top: var(--space-px);
}

.co-stage-pill {
  margin-top: var(--space-1h);
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: var(--space-0) var(--space-2);
  font-size: var(--text-sm);
  font-weight: 700;
  border: 1px solid rgba(15, 23, 42, 0.18);
  background: #eef2f8;
  color: #1e345f;
}

.co-stage-pill.stage-inicializando {
  background: #f3f7ff;
  border-color: rgba(37, 99, 235, 0.25);
  color: #1d4f9f;
}

.co-stage-pill.stage-en_ejecucion {
  background: #eefaf3;
  border-color: rgba(15, 157, 116, 0.3);
  color: #11644b;
}

.co-stage-pill.stage-bloqueado {
  background: #fff4f4;
  border-color: rgba(220, 38, 38, 0.3);
  color: #9f1f1f;
}

.co-stage-pill.stage-en_revision {
  background: #fff8eb;
  border-color: rgba(217, 119, 6, 0.3);
  color: #8a4d06;
}

.co-stage-pill.stage-completado {
  background: #eaf8ff;
  border-color: rgba(2, 132, 199, 0.3);
  color: #0c5d85;
}

.co-flow-indicator {
  margin: var(--space-1h) 0 var(--space-2h);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  align-items: center;
  font-size: var(--text-sm);
  color: #4b5f8a;
}

.co-flow-step {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: var(--space-px) var(--space-1h);
  border: 1px solid rgba(15, 23, 42, 0.15);
  background: #f6f8fc;
}

.co-flow-step.active {
  border-color: rgba(37, 99, 235, 0.35);
  background: #edf3ff;
  color: #143a8f;
  font-weight: 700;
}

.co-flow-sep {
  color: #7a89a9;
}

.co-grid {
  display: grid;
  gap: var(--space-2);
  grid-template-columns: 1fr;
  margin-top: var(--space-2);
}

.co-card {
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #fbfdff;
  padding: var(--space-2h);
}

.co-card-highlight {
  border-color: rgba(37, 99, 235, 0.28);
  background: #f3f7ff;
}

.co-card-summary {
  border-color: rgba(15, 23, 42, 0.16);
  background: #f8fbff;
}

.co-card-health {
  border-color: rgba(16, 185, 129, 0.28);
  background: #f4fbf8;
}

.co-card-operability {
  border-color: rgba(2, 132, 199, 0.28);
  background: #f2f9ff;
}

.co-signal-grid {
  display: grid;
  gap: var(--space-1);
  grid-template-columns: 1fr;
}

.co-signal-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.15);
  background: #f8fbff;
  color: #23406f;
  font-size: var(--text-xs-plus);
  padding: var(--space-px) var(--space-1h);
  margin-right: var(--space-0);
}

.co-summary-grid {
  display: grid;
  gap: var(--space-1);
  grid-template-columns: 1fr;
}

.co-summary-kv {
  font-size: var(--text-body);
  line-height: 1.35;
}

.co-card h4 {
  margin: 0 0 8px;
  font-size: var(--text-base);
  color: #173570;
}

.co-details-group {
  border: 1px solid rgba(23, 53, 112, 0.12);
  border-radius: 12px;
  padding: 0;
}

.co-details-group[open] {
  padding: 0 12px 12px;
}

.co-details-summary {
  cursor: pointer;
  padding: var(--space-2h) var(--space-3);
  font-weight: 700;
  font-size: var(--text-base);
  color: #173570;
  list-style: none;
  user-select: none;
}

.co-details-summary::-webkit-details-marker {
  display: none;
}

.co-details-summary::before {
  content: "▸ ";
}

.co-details-group[open] > .co-details-summary::before {
  content: "▾ ";
}

.co-tech-layer {
  opacity: 0.7;
}

.co-row {
  margin-bottom: var(--space-1h);
}

.co-grid-2 {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-1h);
}

.co-content {
  font-size: var(--text-body);
  color: #2e4576;
  white-space: pre-wrap;
  line-height: 1.4;
}

.co-list {
  margin: 0;
  padding-left: var(--space-4);
}

.co-list li {
  margin: var(--space-0) 0;
  font-size: var(--text-body);
}

.co-deliverable {
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
  background: #ffffff;
  padding: var(--space-2);
  margin-bottom: var(--space-1h);
}

.co-pill {
  display: inline-block;
  margin-left: var(--space-1);
  font-size: var(--text-xs-plus);
  border-radius: 999px;
  padding: var(--space-px) var(--space-1h);
  background: #edf3ff;
  color: #1a448f;
  border: 1px solid rgba(37, 99, 235, 0.25);
}

.co-muted {
  font-size: var(--text-sm);
  color: #5a6f9b;
}

.co-deliverable-controls {
  margin-top: var(--space-1h);
  padding-top: var(--space-1h);
  border-top: 1px dashed var(--line-soft);
}

.co-activity-list {
  display: grid;
  gap: var(--space-1h);
}

.co-activity-item {
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
  background: #ffffff;
  padding: var(--space-1h) var(--space-2);
}

.co-activity-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-1h);
  margin-bottom: var(--space-0);
}

.co-btn-sm {
  margin-top: var(--space-1h);
  padding: var(--space-1h) var(--space-2h);
  font-size: var(--text-body);
}

.bienvenida {
  font-size: var(--text-base);
  background: linear-gradient(180deg, #f7f9fc 0%, #ffffff 100%);
  border: 1px solid var(--line-soft);
  border-top: 3px solid var(--primary);
  border-radius: 16px;
  padding: var(--space-4) 22px;
  margin: var(--space-2h) 0 var(--space-3h);
  box-shadow: 0 4px 14px -4px rgba(11, 20, 48, 0.06);
}
.tier-momentum .bienvenida {
  background: linear-gradient(180deg, #ffffff 0%, #fefcf6 100%);
  border-top: 3px solid var(--gold);
  box-shadow: 0 8px 22px -6px rgba(245, 158, 11, 0.18),
              0 2px 6px -2px rgba(11, 20, 48, 0.06);
}
.bienvenida p:first-child {
  font-size: var(--text-md);
  color: var(--ink);
}
.bienvenida p:first-child strong {
  color: var(--primary-strong);
  font-weight: 700;
}

#progresoUsuario p {
  margin: 0;
}

#progresoUsuario p + p {
  margin-top: 7px;
}

#estadoDiaBox,
#mentorContextBox,
#deudaBox,
#emergenciaBox,
#evidenciaBox {
  padding: var(--space-3) !important;
}

#diaActual {
  margin: var(--space-3h) 0 var(--space-1);
  font-size: clamp(1.25rem, 3vw, 1.55rem);
  color: #0f2d67;
}

#mentorContextBox {
  background: linear-gradient(135deg, #f7fbff 0%, #eef2ff 100%) !important;
  border: 1px solid rgba(99,102,241,0.2) !important;
  border-radius: 16px !important;
  padding: var(--space-3h) var(--space-4) !important;
}

/* ============================================================
   MENTOR CONTEXT PREMIUM — bloque rico (nivel + objetivo + foco + diagnóstico + pregunta del día + progresión)
   Reemplaza el "kinder" de 2 líneas con un análisis profesional, personalizado y retroalimentado.
   ============================================================ */
#mentorObjetivo { font-size: var(--text-base); line-height: 1.55; color: #1e1b4b; }

/* ── PUENTE DÍA ANTERIOR → HOY (lo que pasó ayer y cómo lo usamos hoy) ── */
.mc-ayer {
  margin-bottom: var(--space-3h);
  padding: var(--space-3) var(--space-3h);
  background: linear-gradient(135deg, rgba(99,102,241,0.05) 0%, rgba(168,85,247,0.05) 100%);
  border: 1px solid rgba(99,102,241,0.2);
  border-radius: 12px;
}
.mc-ayer-title {
  font-weight: 800;
  font-size: var(--text-body);
  color: #4338ca;
  margin-bottom: var(--space-2h);
  letter-spacing: 0.02em;
}
.mc-ayer-yesterday {
  padding: var(--space-2) var(--space-2h);
  background: rgba(255,255,255,0.7);
  border: 1px dashed rgba(100,116,139,0.4);
  border-radius: 8px;
  margin-bottom: var(--space-1h);
}
.mc-ayer-yesterday-header {
  font-size: var(--text-xs);
  font-weight: 800;
  color: #64748b;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: var(--space-0);
}
.mc-ayer-yesterday-metrics {
  font-size: var(--text-base);
  font-weight: 700;
  color: #1e1b4b;
  margin-bottom: var(--space-1);
}
.mc-ayer-yesterday-line {
  font-size: var(--text-sm);
  color: #475569;
  line-height: 1.5;
  margin-top: var(--space-0);
}
.mc-ayer-yesterday-line strong {
  color: #334155;
  font-weight: 700;
}
.mc-ayer-arrow {
  text-align: center;
  font-size: var(--text-2xl);
  color: #6366f1;
  font-weight: 800;
  margin: var(--space-0) 0;
  line-height: 1;
}
.mc-ayer-today {
  padding: var(--space-2h) var(--space-3);
  background: linear-gradient(135deg, rgba(16,185,129,0.08) 0%, rgba(52,211,153,0.08) 100%);
  border: 1.5px solid rgba(16,185,129,0.3);
  border-left: var(--space-0) solid #10b981;
  border-radius: 8px;
}
.mc-ayer-today-header {
  font-size: var(--text-xs);
  font-weight: 800;
  color: #047857;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: var(--space-0);
}
.mc-ayer-today-msg {
  font-size: var(--text-base);
  font-weight: 600;
  color: #064e3b;
  line-height: 1.55;
}
.mc-ayer-firstday {
  background: linear-gradient(135deg, rgba(59,130,246,0.05) 0%, rgba(99,102,241,0.06) 100%);
  border-color: rgba(59,130,246,0.25);
}
.mc-ayer-firstday-msg {
  font-size: var(--text-body);
  line-height: 1.55;
  color: #1e3a8a;
  font-style: italic;
  padding: var(--space-1) 0;
}

.mc-level { margin-bottom: var(--space-3); }
.mc-level-badge {
  display: inline-block;
  padding: 5px 14px;
  border-radius: 999px;
  font-size: var(--text-xs-plus);
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  color: #fff;
  margin-bottom: var(--space-1h);
  box-shadow: 0 2px 8px rgba(99,102,241,0.25);
}
.mc-level-badge.mc-lvl-vendedor       { background: linear-gradient(135deg, #059669, #10b981); }
.mc-level-badge.mc-lvl-primer_cierre  { background: linear-gradient(135deg, #0284c7, #0ea5e9); }
.mc-level-badge.mc-lvl-avanzado_baseline { background: linear-gradient(135deg, #0d9488 0%, #14b8a6 50%, #d97706 100%); }
.mc-level-badge.mc-lvl-gen_leads      { background: linear-gradient(135deg, #7c3aed, #a855f7); }
.mc-level-badge.mc-lvl-primeras_senales { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
.mc-level-badge.mc-lvl-en_movimiento  { background: linear-gradient(135deg, #d97706, #f59e0b); }
.mc-level-badge.mc-lvl-arrancando     { background: linear-gradient(135deg, #475569, #64748b); }
.mc-level-badge.mc-lvl-dia_1          { background: linear-gradient(135deg, #1e40af, #3b82f6); }
.mc-level-reasoning {
  font-size: var(--text-body);
  line-height: 1.6;
  color: #312e81;
  font-style: italic;
  padding-left: var(--space-2);
  border-left: 3px solid rgba(99,102,241,0.35);
}

.mc-section {
  margin-top: var(--space-3);
  padding: var(--space-2h) var(--space-3);
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(99,102,241,0.15);
  border-radius: var(--radius-md);
}
.mc-section-title {
  font-weight: 800;
  font-size: var(--text-sm);
  color: #4338ca;
  margin-bottom: var(--space-1h);
  letter-spacing: 0.02em;
}

.mc-section-obj { border-left: var(--space-0) solid #6366f1; }
.mc-obj-text {
  font-size: var(--text-base);
  font-weight: 700;
  color: #1e1b4b;
  margin-bottom: var(--space-1h);
  line-height: 1.4;
}
.mc-obj-bar {
  height: var(--space-2);
  background: rgba(99,102,241,0.1);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: var(--space-1);
}
.mc-obj-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #10b981, #34d399);
  transition: width 0.6s ease;
}
.mc-obj-bar-fill.behind {
  background: linear-gradient(90deg, #f59e0b, #fbbf24);
}
.mc-obj-progress { font-size: var(--text-sm); color: #475569; margin-top: var(--space-0); }
.mc-obj-status {
  font-size: var(--text-sm);
  font-weight: 700;
  margin-top: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border-radius: 8px;
}
.mc-obj-status-ok { background: rgba(16,185,129,0.1); color: #047857; border-left: 3px solid #10b981; }
.mc-obj-status-behind { background: rgba(245,158,11,0.1); color: #b45309; border-left: 3px solid #f59e0b; }
.mc-obj-no-goal { background: rgba(148,163,184,0.1); color: #475569; font-style: italic; font-weight: 500; }

.mc-section-foco { border-left: var(--space-0) solid #8b5cf6; }
.mc-foco-tags { display: flex; gap: var(--space-1h); flex-wrap: wrap; margin-bottom: var(--space-1h); }
.mc-tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: var(--text-xs-plus);
  font-weight: 700;
}
.mc-tag-etapa { background: rgba(139,92,246,0.12); color: #6d28d9; border: 1px solid rgba(139,92,246,0.3); }
.mc-tag-fase  { background: rgba(99,102,241,0.12); color: #4338ca; border: 1px solid rgba(99,102,241,0.3); }
.mc-foco-desc { font-size: var(--text-body); color: #312e81; line-height: 1.55; }

/* ── MODO OPERATIVO (Escalar / Cerrar / Ajustar / Outreach) ── */
.mc-modo {
  margin: var(--space-0) 0 var(--space-2h) 0;
  padding: var(--space-2) var(--space-2h);
  background: rgba(255,255,255,0.85);
  border-radius: var(--radius-md);
  border: 1px solid rgba(99,102,241,0.18);
}
.mc-modo-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-3);
  border-radius: 999px;
  font-size: var(--text-sm);
  font-weight: 800;
  letter-spacing: 0.03em;
  color: #fff;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
  margin-bottom: var(--space-1h);
}
.mc-modo-icon { font-size: var(--text-md); }
.mc-modo-label { letter-spacing: 0.02em; }
.mc-modo-scale    { background: linear-gradient(135deg, #059669, #10b981); }
.mc-modo-close    { background: linear-gradient(135deg, #0284c7, #0ea5e9); }
.mc-modo-adjust   { background: linear-gradient(135deg, #d97706, #f59e0b); }
.mc-modo-outreach { background: linear-gradient(135deg, #475569, #64748b); }
.mc-modo-desc {
  font-size: var(--text-body);
  line-height: 1.55;
  color: #1e1b4b;
  font-style: italic;
  padding-left: var(--space-0);
}

/* ── DESFASE DE FASE (user ahead of calendar — positive message) ── */
.mc-desfase {
  margin-top: var(--space-2h);
  padding: var(--space-2) var(--space-2h);
  background: linear-gradient(135deg, rgba(209,250,229,0.7) 0%, rgba(167,243,208,0.5) 100%);
  border: 1px solid rgba(16,185,129,0.35);
  border-left: var(--space-0) solid #10b981;
  border-radius: 8px;
}
.mc-desfase-title {
  font-weight: 800;
  font-size: var(--text-sm);
  color: #047857;
  margin-bottom: var(--space-0);
  letter-spacing: 0.02em;
}
.mc-desfase-msg {
  font-size: var(--text-sm);
  line-height: 1.55;
  color: #065f46;
}

/* audit 2026-05-04: visual desfase calendar→operating */
.mc-desfase-visual {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
  flex-wrap: wrap;
}
.mc-desfase-pill {
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 9999px;
  white-space: nowrap;
}
.mc-desfase-pill-cal {
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #cbd5e1;
}
.mc-desfase-pill-op.is-ahead {
  background: #10b981;
  color: white;
  box-shadow: 0 2px 6px rgba(16, 185, 129, 0.35);
}
.mc-desfase-pill-op.is-behind {
  background: #f59e0b;
  color: white;
  box-shadow: 0 2px 6px rgba(245, 158, 11, 0.35);
}
.mc-desfase-arrow {
  font-size: 18px;
  font-weight: 800;
  color: #64748b;
}
.mc-desfase-behind {
  background: linear-gradient(135deg, rgba(254,243,199,0.7) 0%, rgba(253,230,138,0.5) 100%);
  border-color: rgba(245,158,11,0.35);
  border-left-color: #f59e0b;
}
.mc-desfase-behind .mc-desfase-title { color: #b45309; }
.mc-desfase-behind .mc-desfase-msg { color: #78350f; }

.mc-section-diag { border-left: var(--space-0) solid #0ea5e9; }
.mc-diag-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mc-diag-list li {
  font-size: var(--text-body);
  line-height: 1.55;
  color: #1e293b;
  padding: var(--space-1) 0 var(--space-1) var(--space-4);
  position: relative;
}
.mc-diag-list li::before {
  content: "▸";
  position: absolute;
  left: 0;
  color: #0ea5e9;
  font-weight: 800;
}

.mc-section-question {
  border-left: var(--space-0) solid #f59e0b;
  background: linear-gradient(135deg, rgba(254,243,199,0.6) 0%, rgba(255,255,255,0.7) 100%);
}
.mc-section-question .mc-section-title { color: #b45309; }
.mc-question-text {
  font-size: var(--text-base);
  font-weight: 600;
  color: #1e293b;
  line-height: 1.55;
  padding: var(--space-1h) 0;
  font-style: italic;
}
.mc-question-intro {
  font-size: var(--text-xs-plus);
  color: #78716c;
  margin-top: var(--space-0);
  line-height: 1.5;
}

.mc-section-prog { border-left: var(--space-0) solid #10b981; }
.mc-prog-summary { font-size: var(--text-sm); color: #064e3b; line-height: 1.5; margin-bottom: var(--space-1); }
.mc-prog-metrics { font-size: var(--text-sm); color: #475569; }
.mc-prog-metrics strong { color: #1e1b4b; font-weight: 800; }

@media (max-width: 640px) {
  #mentorContextBox { padding: var(--space-2h) var(--space-3) !important; }
  .mc-level-badge { font-size: var(--text-xs); padding: var(--space-0) var(--space-2h); }
  .mc-level-reasoning { font-size: var(--text-sm); }
  .mc-section { padding: var(--space-2) var(--space-2h); margin-top: var(--space-2); }
  .mc-section-title { font-size: var(--text-xs-plus); }
  .mc-obj-text { font-size: var(--text-body); }
  .mc-question-text { font-size: var(--text-body); }
  .mc-modo { padding: var(--space-1h) var(--space-2); }
  .mc-modo-badge { font-size: var(--text-xs-plus); padding: 5px 12px; }
  .mc-modo-desc { font-size: var(--text-sm); }
  .mc-desfase { padding: var(--space-1h) var(--space-2); }
  .mc-desfase-msg { font-size: var(--text-sm); }
  .mc-ayer { padding: var(--space-2h) var(--space-3); margin-bottom: var(--space-2h); }
  .mc-ayer-title { font-size: var(--text-xs-plus); margin-bottom: var(--space-2); }
  .mc-ayer-yesterday { padding: var(--space-1h) var(--space-2); }
  .mc-ayer-yesterday-metrics { font-size: var(--text-body); }
  .mc-ayer-yesterday-line { font-size: var(--text-xs-plus); }
  .mc-ayer-today { padding: var(--space-2) var(--space-2h); }
  .mc-ayer-today-msg { font-size: var(--text-body); }
  .mc-ayer-firstday-msg { font-size: var(--text-sm); }
}

/* #asesorDiaBox CSS eliminado — sistema viejo removido */

#planJson .plan-card,
#planTexto {
  border-radius: 16px;
}

#planTexto {
  margin-top: var(--space-2);
  padding: var(--space-3);
  border: 1px solid var(--line-soft);
  background: #fff;
}

#planTexto p {
  margin: 0 0 8px;
  font-size: var(--text-base);
}

.plan-json {
  margin-top: var(--space-2h);
}

.plan-card {
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  padding: var(--space-3);
}

/* ═══ Plan Tier System ═══ */
.plan-tier { margin-bottom: var(--space-1); }
.plan-tier-action { /* Always visible, no toggle */ }

/* Day 1 welcome block */
/* Day 1 Welcome Overlay (fullscreen premium) */
.day1-welcome-overlay {
  position: fixed;
  inset: 0;
  background: linear-gradient(135deg, #0f0a2e 0%, #1e1b4b 40%, #312e81 100%);
  z-index: var(--z-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4h);
  transition: opacity 0.4s ease;
}
.d1w-card {
  max-width: 440px;
  width: 100%;
  text-align: center;
  animation: insightFadeIn 0.6s ease;
}
.d1w-greeting {
  font-size: var(--text-body);
  color: #a5b4fc;
  margin-bottom: var(--space-0);
}
.d1w-title {
  font-size: var(--text-3xl);
  font-weight: 800;
  color: #fff;
  margin-bottom: var(--space-4h);
  line-height: 1.3;
}
.d1w-diagnostic {
  text-align: left;
  margin-bottom: var(--space-4h);
}
.d1w-diag-row {
  padding: var(--space-2) var(--space-3);
  border-left: 3px solid rgba(165,180,252,0.3);
  margin-bottom: var(--space-1h);
}
.d1w-diag-row:nth-child(1) { border-left-color: #34d399; }
.d1w-diag-row:nth-child(2) { border-left-color: #fb923c; }
.d1w-diag-row:nth-child(3) { border-left-color: #818cf8; }
.d1w-diag-label {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-mute-dark);
  margin-bottom: var(--space-px);
}
.d1w-diag-value {
  font-size: var(--text-sm);
  line-height: 1.5;
  color: #e0e7ff;
}
.d1w-timeline {
  margin: var(--space-4) 0;
}
.d1w-timeline-title {
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #818cf8;
  margin-bottom: var(--space-2);
}
.d1w-timeline-track {
  position: relative;
  min-height: 110px;
  padding-bottom: var(--space-7);
  padding-top: var(--space-3h);
  background: linear-gradient(90deg, rgba(99,102,241,0.15), rgba(139,92,246,0.15));
  border-radius: var(--radius-sm);
  margin: 0 12px 8px;
}
.d1w-hito {
  position: absolute;
  top: var(--space-2h);
  text-align: center;
  transform: translateX(-50%);
  width: 90px;
}
.d1w-hito-dot {
  width: var(--space-2h);
  height: var(--space-2h);
  background: #6366f1;
  border-radius: 50%;
  margin: 0 auto 6px;
  border: var(--space-px) solid #1e1b4b;
  box-shadow: 0 0 0 1px #6366f1;
}
.d1w-hito-today {
  background: #fbbf24;
  box-shadow: 0 0 0 1px #fbbf24, 0 0 8px rgba(251,191,36,0.5);
  animation: pulse 2s infinite;
}
@keyframes pulse { 0%,100% { box-shadow: 0 0 0 1px #fbbf24, 0 0 4px rgba(251,191,36,0.3); } 50% { box-shadow: 0 0 0 2px #fbbf24, 0 0 12px rgba(251,191,36,0.6); } }
.d1w-hito-day {
  font-size: var(--text-xs);
  font-weight: 800;
  color: #c7d2fe;
  margin-bottom: var(--space-px);
  white-space: nowrap;
}
.d1w-hito-label {
  font-size: 0.65rem;
  color: var(--ink-mute-dark);
  line-height: 1.25;
  word-wrap: break-word;
  hyphens: auto;
  padding: 0 2px;
}
.d1w-prediction {
  font-size: var(--text-body);
  color: #c7d2fe;
  margin-bottom: var(--space-4h);
  line-height: 1.5;
}
.d1w-m90-badge {
  display: inline-block;
  background: linear-gradient(135deg, #fbbf24, #d97706);
  color: #1e1b4b;
  font-weight: 800;
  font-size: 0.65rem;
  padding: 3px 12px;
  border-radius: 12px;
  letter-spacing: 0.12em;
  margin-bottom: var(--space-3h);
}
.d1w-cta {
  display: inline-block;
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  color: #fff;
  font-size: var(--text-md);
  font-weight: 700;
  padding: var(--space-3) 40px;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
  box-shadow: 0 4px 20px rgba(99,102,241,0.4);
}
.d1w-cta:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(99,102,241,0.5); }

/* Day 1 premium wrapper */
.day1-premium-wrapper { background: linear-gradient(180deg, #1e1b4b 0%, transparent 180px); border-radius: 16px; padding: 2px; }
.day1-header { text-align: center; padding: var(--space-4h) 16px 14px; color: #fff; }
.day1-badge { display: inline-block; background: linear-gradient(135deg, #f59e0b, #d97706); color: #1e1b4b; font-weight: 800; font-size: var(--text-xs-plus); padding: 4px var(--radius-lg); border-radius: var(--radius-xl); letter-spacing: 0.1em; margin-bottom: var(--radius-sm); }
.day1-title { font-size: var(--text-xl); font-weight: 800; margin-bottom: var(--space-0); }
.day1-subtitle { font-size: var(--text-body); color: #a5b4fc; font-weight: 500; }

/* Day 1 special sections */
.day1-section { margin: var(--radius-md) 0; padding: 12px var(--radius-lg); border-radius: var(--radius-md); }
.day1-diagnostic { background: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(139,92,246,0.08)); border-left: 3px solid #6366f1; }
.day1-case { background: rgba(16,185,129,0.06); border-left: 3px solid #10b981; }
.day1-roadmap { background: rgba(245,158,11,0.06); border-left: 3px solid #f59e0b; }
.day1-section-title { font-weight: 700; font-size: var(--text-sm); color: #1e293b; margin-bottom: var(--space-1); text-transform: uppercase; letter-spacing: 0.03em; }
.day1-section-body { font-size: var(--text-body); color: #334155; line-height: 1.55; white-space: pre-line; }
.day1-roadmap-items { display: flex; flex-direction: column; gap: var(--space-1); }
.day1-roadmap-item { font-size: var(--text-sm); color: #334155; }
.day1-revenue-target { color: #d97706; font-weight: 700; }

/* M90 strategic insight elevated (days 1-7) */
.m90-day1-insight {
  background: linear-gradient(135deg, #1e1b4b 0%, #312e81 50%, #1e1b4b 100%);
  border: 1.5px solid rgba(167,139,250,0.3);
  border-radius: var(--radius-lg);
  padding: var(--space-4) var(--space-4h);
  margin: var(--space-3) 0;
  position: relative;
  overflow: hidden;
}
.m90-day1-insight::before {
  content: "";
  position: absolute;
  top: 0; left: -50%;
  width: 200%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(251,191,36,0.06), transparent);
  animation: m90Shimmer 3s ease-in-out infinite;
}
@keyframes m90Shimmer { 0% { transform: translateX(-100%); } 100% { transform: translateX(100%); } }
.m90-insight-badge { color: #fbbf24; font-weight: 800; font-size: var(--text-xs); letter-spacing: 0.12em; margin-bottom: var(--space-1h); position: relative; }
.m90-insight-title { color: #e0e7ff; font-weight: 700; font-size: var(--text-base); margin-bottom: var(--space-1); position: relative; }
.m90-insight-body { color: #c4b5fd; font-size: var(--text-body); line-height: 1.55; position: relative; white-space: pre-line; }

/* Revenue progress bar */
.revenue-bar-container { margin: 12px 0; padding: var(--radius-md) var(--radius-lg); background: rgba(99,102,241,0.05); border-radius: var(--radius-md); }
.revenue-bar-label { font-size: var(--text-xs-plus); color: #475569; font-weight: 600; margin-bottom: var(--space-1); }
.revenue-bar-track { height: 8px; background: rgba(99,102,241,0.12); border-radius: 4px; overflow: hidden; }
.revenue-bar-fill { height: 100%; background: linear-gradient(90deg, #6366f1, #8b5cf6); border-radius: 4px; transition: width 0.5s ease; }
.revenue-bar-hint { font-size: var(--text-xs); color: #64748b; margin-top: var(--space-0); }

/* Task tiers */
.task-tier-priority { border-left: 3px solid #ef4444; padding-left: var(--space-2); }
.task-tier-extended { border-left: 3px solid #f59e0b; padding-left: var(--space-2); margin-top: var(--space-1h); }
.task-tier-overachiever { border-left: 3px solid #10b981; padding-left: var(--space-2); margin-top: var(--space-1h); }
.task-tier-overachiever .task-tier-toggle { cursor: pointer; font-weight: 600; font-size: var(--text-sm); color: #10b981; display: flex; align-items: center; justify-content: space-between; }
.task-tier-overachiever.collapsed .plan-tier-body { display: none; }
.task-tier-overachiever.collapsed .toggle-icon { transform: rotate(-90deg); }
.task-porque { font-size: var(--text-xs-plus); color: #6366f1; margin: var(--space-0) 0 var(--space-1h) var(--space-5); line-height: 1.4; }

/* ============================================================
   PLAN v4 — Bloques profundos (diagnostico, reasoning, contexto, riesgos, justificacion por tarea)
   ============================================================ */
.deep-block {
  margin: var(--space-3) 0;
  padding: var(--space-3) var(--space-4);
  background: linear-gradient(135deg, rgba(79,70,229,0.04) 0%, rgba(99,102,241,0.06) 100%);
  border: 1px solid rgba(79,70,229,0.18);
  border-left: var(--space-0) solid #4f46e5;
  border-radius: 0 12px 12px 0;
}
.deep-block-title {
  font-weight: 800;
  font-size: var(--text-body);
  color: #4338ca;
  margin-bottom: var(--space-1h);
  letter-spacing: 0.02em;
  display: flex;
  align-items: center;
  gap: var(--space-1);
}
.deep-block-body {
  font-size: var(--text-base);
  color: #1e1b4b;
  line-height: 1.65;
  white-space: pre-wrap;
}
.deep-risks { border-left-color: #f59e0b; background: linear-gradient(135deg, rgba(245,158,11,0.05) 0%, rgba(251,191,36,0.08) 100%); }
.deep-risks .deep-block-title { color: #b45309; }

.risks-list { list-style: none; margin: 0; padding: 0; }
.risk-item {
  margin-bottom: var(--space-2);
  padding: var(--space-2) var(--space-2h);
  background: rgba(255,255,255,0.6);
  border-radius: 8px;
  border-left: 3px solid #f59e0b;
}
.risk-item:last-child { margin-bottom: 0; }
.risk-text { font-size: var(--text-body); color: #1e1b4b; line-height: 1.5; margin-bottom: var(--space-0); }
.risk-mit { font-size: var(--text-sm); color: #475569; line-height: 1.5; }
.risk-text strong { color: #b45309; }
.risk-mit strong { color: #047857; }

.task-justificacion {
  margin: var(--space-1) 0 var(--space-1h) var(--space-5);
  font-size: var(--text-sm);
}
.task-justificacion summary {
  cursor: pointer;
  color: #6366f1;
  font-weight: 600;
  padding: var(--space-0) 0;
  user-select: none;
  list-style: none;
}
.task-justificacion summary::-webkit-details-marker { display: none; }
.task-justificacion summary::before {
  content: "▸ ";
  display: inline-block;
  transition: transform 0.2s;
}
.task-justificacion[open] summary::before {
  transform: rotate(90deg);
}
.task-justificacion summary:hover { color: #4338ca; }
.task-justificacion-body {
  margin-top: var(--space-1);
  padding: var(--space-1h) var(--space-2h);
  background: rgba(99,102,241,0.04);
  border-left: var(--space-px) solid #c7d2fe;
  border-radius: 0 6px 6px 0;
  color: #312e81;
  line-height: 1.55;
}

/* Mobile: ajustes */
@media (max-width: 640px) {
  .deep-block { padding: var(--space-2h) var(--space-3); margin: var(--space-2h) 0; }
  .deep-block-body { font-size: var(--text-body); line-height: 1.6; }
  .deep-block-title { font-size: var(--text-sm); }
  .risk-item { padding: var(--space-1h) var(--space-2); }
  .task-justificacion { margin-left: var(--space-3); }
}

.task-script { margin: var(--space-0) 0 var(--space-2) var(--space-5); }
.task-script-label { font-size: var(--text-xs); font-weight: 700; color: #475569; margin-bottom: var(--space-0); }
.task-script-text { font-size: var(--text-sm); background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: var(--radius-md) 12px; white-space: pre-wrap; word-break: break-word; color: #1e293b; line-height: 1.5; }
.plan-tier-context,
.plan-tier-deep {
  border-top: 1px solid var(--line-soft);
  padding-top: var(--space-1h);
  margin-top: var(--space-1h);
}
.plan-tier-toggle {
  cursor: pointer;
  font-weight: 700;
  font-size: var(--text-sm);
  color: #475569;
  padding: var(--space-1) 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  user-select: none;
}
.plan-tier-toggle:hover { color: #1e293b; }
.toggle-icon {
  font-size: var(--text-xs);
  transition: transform 0.2s ease;
  display: inline-block;
}
.plan-tier.collapsed .plan-tier-body { display: none; }
.plan-tier.collapsed .toggle-icon { transform: rotate(-90deg); }

.plan-head {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--line-soft);
  margin-bottom: var(--space-2);
}

.plan-day {
  font-size: var(--text-md);
  font-weight: 780;
}

.plan-goal {
  font-size: var(--text-base);
  color: var(--ink-soft);
}

.plan-section {
  margin-top: var(--space-2h);
}

/* Business snapshot — compact context above plan */
.business-snapshot {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  margin-bottom: var(--space-2);
  padding: var(--space-1h) var(--space-2);
  background: rgba(15,23,42,0.03);
  border: 1px solid rgba(15,23,42,0.08);
  border-radius: var(--radius-md);
}
.bsnap-item {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-0);
  font-size: var(--text-xs-plus);
  color: #334155;
  background: #fff;
  border: 1px solid rgba(15,23,42,0.08);
  border-radius: var(--radius-sm);
  padding: var(--space-px) var(--space-1h);
}
.bsnap-label {
  font-weight: 700;
  color: #1e40af;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.bsnap-blocker { border-color: rgba(239,68,68,0.2); }
.bsnap-blocker .bsnap-label { color: #dc2626; }
.bsnap-metrics { border-color: rgba(16,185,129,0.2); }
.bsnap-metrics .bsnap-label { color: #059669; }

/* Target metrics row */
.plan-metrics-target {
  background: rgba(16,185,129,0.06);
  border: 1px solid rgba(16,185,129,0.18);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
}
.metrics-target-row {
  display: flex;
  gap: var(--space-3h);
  flex-wrap: wrap;
  margin-top: var(--space-1);
}
.metric-target-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 60px;
}
.metric-target-num {
  font-size: var(--text-2xl);
  font-weight: 800;
  color: #059669;
  line-height: 1.2;
}
.metric-target-label {
  font-size: var(--text-xs);
  font-weight: 600;
  color: #047857;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.sec-title {
  margin-bottom: var(--space-1);
  font-size: var(--text-body);
  font-weight: 760;
  color: #253f75;
}

.sec-body {
  font-size: var(--text-base);
  white-space: pre-wrap;
}

.sec-body.mono {
  background: #f6f9ff;
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
  padding: var(--space-2);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.tasks {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: var(--space-2);
}

.task {
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #fbfdff;
  padding: var(--space-2);
}

.task-top {
  display: flex;
  gap: var(--space-2);
  align-items: flex-start;
}

.task-num {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #e8f0ff;
  color: #1740a0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-body);
  font-weight: 800;
}

.task-main {
  flex: 1;
  min-width: 0;
}

.task-accion {
  font-size: var(--text-base);
  font-weight: 650;
  white-space: pre-wrap;
}

.task-meta {
  margin-top: var(--space-0);
}

.sub {
  margin-top: var(--space-1h);
  color: var(--ink-soft);
  font-size: var(--text-body);
}

.pill {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(37, 99, 235, 0.25);
  border-radius: 999px;
  padding: 3px 8px;
  font-size: var(--text-xs-plus);
  color: #1a448f;
  background: #edf3ff;
}

.bullets {
  margin: 0;
  padding-left: var(--space-4);
}

.bullets li {
  margin: 5px 0;
}

.plan-grid2 {
  display: grid;
  gap: var(--space-2);
  grid-template-columns: 1fr;
}

#evidenciaBox label {
  font-weight: 620;
  color: #1f3d78;
  font-size: var(--text-base);
}

#evidenciaBox textarea,
#evidenciaBox input,
#evidenciaBox select {
  margin-bottom: var(--space-1h);
}

#evidenciaBox h3,
#deudaBox h3,
#emergenciaBox h3 {
  margin-top: 0;
  margin-bottom: var(--space-1h);
  font-size: var(--text-md);
}

#acciones.botonera-dia {
  margin-top: var(--space-4);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2);
}

#acciones button {
  width: 100%;
}

#btnCompletar {
  background: #0f9d74;
  box-shadow: 0 10px 18px rgba(15, 157, 116, 0.24);
}

#btnCompletar:hover {
  background: #0a8b66;
}

.loader {
  margin-top: var(--space-2);
  color: #2b4c8a;
  font-size: var(--text-base);
}

.loader-ayuda-animated {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-2h);
  padding: var(--space-3) var(--space-4);
  background: rgba(43, 76, 138, 0.07);
  border-radius: 12px;
  border: 1px solid rgba(43, 76, 138, 0.15);
}

.loader-ayuda-animated .loader-spinner {
  width: 22px;
  height: 22px;
  border: 3px solid rgba(43, 76, 138, 0.2);
  border-top-color: #2b4c8a;
  border-radius: 50%;
  animation: loaderSpin 0.8s linear infinite;
}

.loader-ayuda-animated .loader-text {
  font-size: var(--text-base);
  color: #2b4c8a;
  font-weight: 600;
}

.loader-ayuda-animated .loader-sub {
  font-size: var(--text-sm);
  color: #5a6a8a;
  font-weight: 400;
  margin-top: var(--space-px);
}

@keyframes loaderSpin {
  to { transform: rotate(360deg); }
}

/* === Plan Skeleton Loader (premium loading state) === */
.plan-skeleton-loader {
  margin: var(--space-5) auto;
  padding: 28px 24px;
  background: var(--surface);
  border-radius: var(--radius-xl);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}

.plan-skeleton-header {
  display: flex;
  align-items: center;
  gap: var(--space-2h);
  margin-bottom: var(--space-5);
}

.skeleton-badge {
  width: var(--space-7);
  height: 22px;
  border-radius: var(--radius-pill);
  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
  background-size: 200% 100%;
  animation: skeletonShimmer 1.8s infinite ease-in-out;
}

.skeleton-line {
  height: var(--space-2h);
  border-radius: var(--radius-sm);
  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
  background-size: 200% 100%;
  animation: skeletonShimmer 1.8s infinite ease-in-out;
  margin-bottom: var(--space-2);
}

.skeleton-line-xl { width: 95%; height: var(--space-3); }
.skeleton-line-lg { width: 80%; }
.skeleton-line-md { width: 60%; }
.skeleton-line-sm { width: 40%; }

.skeleton-block-mentor {
  height: var(--space-8);
  border-radius: var(--radius-md);
  border-left: 3px solid #cbd5e1;
  background: linear-gradient(90deg, #f1f5f9 25%, #f8fafc 50%, #f1f5f9 75%);
  background-size: 200% 100%;
  animation: skeletonShimmer 1.8s infinite ease-in-out;
  margin-bottom: var(--space-4h);
  padding: var(--space-2h);
}

.skeleton-task {
  display: flex;
  align-items: center;
  gap: var(--space-2h);
  margin-bottom: var(--space-3);
  padding: var(--space-2) var(--space-2h);
  background: #f8fafc;
  border-radius: var(--radius-md);
  border-left: 3px solid #e2e8f0;
}

.skeleton-circle {
  width: var(--space-4h);
  height: var(--space-4h);
  border-radius: 50%;
  flex-shrink: 0;
  background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
  background-size: 200% 100%;
  animation: skeletonShimmer 1.8s infinite ease-in-out;
}

@keyframes skeletonShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.final-mensaje {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 700;
  color: #0b6f53;
}

.final-section {
  margin-top: var(--space-2h);
  padding: var(--space-2) 0;
}

.final-section-title {
  font-weight: 700;
  font-size: var(--text-base);
  color: #173570;
  margin-bottom: var(--space-1);
}

#respuestaAyuda {
  margin-top: var(--space-2h);
  padding: var(--space-3);
  border-radius: 12px;
  border: 1px solid rgba(37, 99, 235, 0.18);
  background: #f6faff;
}

#respuestaAyuda h3 {
  margin: 0 0 8px;
  color: #173f8f;
}

.respuesta p {
  margin: 0;
}

.fuentes {
  margin-top: var(--space-2);
  border-top: 1px dashed var(--line);
  padding-top: var(--space-1h);
}

.fuente {
  margin-bottom: var(--space-1h);
  padding: var(--space-1) 0;
}

#mensajeCompletado {
  margin-top: var(--space-2);
  border: 1px solid rgba(15, 157, 116, 0.28);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-2h);
  background: var(--success-soft);
  color: #0b6f53;
  font-weight: 650;
  text-align: center;
}

#historial {
  margin-top: var(--space-4);
  padding: var(--space-3);
}

#historial h2 {
  margin: 0;
  font-size: var(--text-md);
  color: #163570;
}

#listaHistorial {
  list-style: none;
  padding: 0;
  margin: var(--space-2h) 0 0;
}

.item-dia {
  padding: var(--space-2) var(--space-2h);
  border-radius: var(--radius-md);
  border: 1px solid var(--line-soft);
  margin-bottom: var(--space-2);
}

.item-completado {
  background: rgba(15, 157, 116, 0.09);
  border-left: var(--space-0) solid var(--success);
}

.item-saltado {
  background: rgba(37, 99, 235, 0.08);
  border-left: var(--space-0) solid var(--primary);
}

.item-incompleto {
  background: rgba(220, 38, 38, 0.08);
  border-left: var(--space-0) solid var(--danger);
}

.cerrar-historial {
  cursor: pointer;
  border-radius: 8px;
  padding: var(--space-px) var(--space-1);
}

.cerrar-historial:hover {
  background: #edf3ff;
}

#mensajeFlotante {
  position: fixed;
  top: var(--space-4);
  left: 50%;
  transform: translateX(-50%);
  max-width: min(88vw, 560px);
  padding: var(--space-2) var(--space-3);
  border-radius: 999px;
  background: #112f6c;
  color: #fff;
  font-size: var(--text-base);
  z-index: var(--z-notification);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

#mensajeFlotante.show {
  opacity: 1;
}

/* === Progress stats row === */
.progress-stats-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1h);
  margin: var(--space-1h) 0;
  align-items: center;
}

.stat-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-0);
  padding: var(--space-0) var(--space-2);
  border-radius: var(--radius-xl);
  font-size: var(--text-sm);
  font-weight: 600;
  background: rgba(15, 23, 42, 0.06);
  color: #1e293b;
}

.stat-chip-secondary {
  background: rgba(245, 158, 11, 0.12);
  color: #92400e;
  font-size: var(--text-xs-plus);
}

.progress-actions-row {
  margin-top: var(--space-1);
}

.btn-micro {
  min-height: 44px;
  padding: var(--space-2) var(--space-2h);
  font-size: var(--text-xs-plus);
  border-radius: 16px;
  border: 1px solid rgba(15, 23, 42, 0.15);
  background: rgba(255, 255, 255, 0.7);
  color: #334155;
  cursor: pointer;
  font-weight: 600;
}
.btn-micro:hover {
  background: rgba(15, 23, 42, 0.06);
}

/* === Journey bar (30-day progress) === */
.journey-bar-container {
  margin: var(--space-1h) 0 var(--space-0);
}

.journey-bar-label {
  font-size: var(--text-xs-plus);
  font-weight: 600;
  color: #475569;
  margin-bottom: var(--space-0);
}

.journey-bar {
  position: relative;
  height: var(--space-1h);
  background: rgba(15, 23, 42, 0.08);
  border-radius: 8px;
  overflow: visible;
}

.journey-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #10b981, #3b82f6);
  border-radius: 8px;
  transition: width 0.6s ease;
}

.journey-bar-markers {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
}

.journey-marker {
  position: absolute;
  top: -2px;
  width: var(--space-px);
  height: var(--space-2h);
  background: rgba(15, 23, 42, 0.25);
  border-radius: 1px;
}

/* === Toast system === */
#toasts-container,
#logros-container {
  position: fixed;
  right: var(--space-3);
  z-index: var(--z-notification);
  width: min(340px, calc(100vw - 28px));
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

#toasts-container {
  top: 70px;
}

#logros-container {
  top: var(--space-3h);
}

.toast-logro {
  position: relative;
  border-radius: 12px;
  padding: var(--space-2h) var(--space-3);
  box-shadow: 0 4px 20px rgba(0,0,0,0.15);
  background: #0f172a;
  color: #fff;
  border-left: var(--space-0) solid #f59e0b;
  animation: toastSlideIn 0.35s ease-out;
}

.toast-logro-epic {
  border-left-width: 5px;
  border-image: linear-gradient(to bottom, #f59e0b, #8b5cf6) 1;
  box-shadow: 0 4px 24px rgba(245, 158, 11, 0.3);
}

.toast-logro-body {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.toast-logro-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: var(--space-px) solid #f59e0b;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-xl);
  flex-shrink: 0;
}

.toast-logro-title {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  opacity: 0.7;
}

.toast-logro-name {
  font-weight: 700;
  font-size: var(--text-base);
}

.toast-logro-desc {
  font-size: var(--text-xs-plus);
  opacity: 0.8;
  margin-top: 1px;
}

.toast-puntos {
  position: relative;
  border-radius: var(--radius-md);
  padding: var(--space-1h) var(--space-3);
  background: rgba(16, 185, 129, 0.12);
  color: #065f46;
  font-weight: 700;
  font-size: var(--text-body);
  border: 1px solid rgba(16, 185, 129, 0.3);
  animation: toastSlideIn 0.3s ease-out;
}

.toast-puntos-body {
  text-align: center;
}

.toast-rankup-body {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

.toast-rankup-icon {
  font-size: var(--text-4xl);
}

.toast-rankup-title {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  opacity: 0.7;
}

.toast-rankup-name {
  font-weight: 800;
  font-size: var(--text-md);
}

@keyframes toastSlideIn {
  from { opacity: 0; transform: translateX(30px); }
  to { opacity: 1; transform: translateX(0); }
}

.cerrar-logro {
  position: absolute;
  top: var(--space-0);
  right: var(--space-1h);
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font-size: var(--text-lg);
  opacity: 0.6;
}
.cerrar-logro:hover { opacity: 1; }

/* === Logros panel (full view) === */
.logros-panel {
  background: #fff;
  border-radius: var(--radius-lg);
  padding: var(--space-3h);
  box-shadow: 0 8px 32px rgba(0,0,0,0.15);
  max-height: 80vh;
  overflow-y: auto;
}

.logros-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-2);
}

.logros-title {
  font-weight: 800;
  font-size: var(--text-md);
  color: #0f172a;
}

.logros-progress-bar {
  height: var(--space-1);
  background: #e2e8f0;
  border-radius: var(--radius-sm);
  margin-bottom: var(--space-3);
  overflow: hidden;
}

.logros-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #10b981, #f59e0b);
  border-radius: var(--radius-sm);
  transition: width 0.5s ease;
}

.logros-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-1h);
}

.logro-card {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-2h);
  border-radius: var(--radius-md);
  border: 1px solid #e2e8f0;
  transition: opacity 0.2s;
}

.logro-unlocked {
  background: #f0fdf4;
  border-color: rgba(16, 185, 129, 0.3);
}

.logro-locked {
  opacity: 0.5;
  background: #f8fafc;
}

.logro-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: var(--space-px) solid #ddd;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-lg);
  flex-shrink: 0;
}

.logro-info {
  flex: 1;
  min-width: 0;
}

.logro-name {
  font-weight: 700;
  font-size: var(--text-body);
  color: #0f172a;
}

.logro-desc {
  font-size: var(--text-xs-plus);
  color: #64748b;
}

.logro-tier {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.modal {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  background: rgba(15, 23, 42, 0.56);
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-content {
  width: min(420px, 92vw);
  border-radius: 16px;
  background: #fff;
  padding: 22px;
  box-shadow: var(--shadow-lg);
  text-align: center;
}

.btn-wsp {
  display: inline-block;
  margin: var(--space-2h) 0;
  border-radius: var(--radius-md);
  background: #16a34a;
  color: #fff;
  text-decoration: none;
  padding: 9px 14px;
  font-weight: 700;
}

.fade-in {
  animation: fadeIn 0.28s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (min-width: 1024px) {
  .plan-grid2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .co-grid,
  .co-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .co-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #pantallaProgreso {
    max-width: 860px;
    margin: 0 auto;
  }
}

@media (max-width: 768px) {
  .container {
    width: 100%;
    min-height: 100dvh;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    padding: var(--space-4) var(--space-3) var(--space-4h);
    background: rgba(255, 255, 255, 0.92);
  }

  .subtitulo {
    margin-bottom: var(--space-3);
    font-size: var(--text-base);
  }

  .wizard-card {
    padding: var(--space-3);
    border-radius: var(--radius-lg);
  }

  .wizard-actions {
    flex-direction: column;
  }

  .wizard-actions button {
    min-width: 0;
  }

  .wizard-textarea {
    min-height: 96px;
    font-size: var(--text-base);
  }

  #progresoUsuario,
  #centroOperacionBox,
  #estadoDiaBox,
  #mentorContextBox,
  #deudaBox,
  #emergenciaBox,
  #evidenciaBox,
  #historial,
  #diaAnteriorBox,
  /* #asesorDiaBox eliminado */

  #diaActual {
    margin-top: var(--space-2h);
    margin-bottom: var(--space-0);
    font-size: 1.28rem;
  }

  #acciones.botonera-dia {
    grid-template-columns: 1fr;
    gap: 9px;
  }

  #acciones button {
    font-size: var(--text-base);
    padding: var(--space-2h) var(--space-3);
  }

  .co-header {
    flex-direction: column;
  }

  #toasts-container,
  #logros-container {
    left: var(--space-2);
    right: var(--space-2);
    width: auto;
  }

  #mensajeFlotante {
    border-radius: 12px;
    max-width: 92vw;
  }

  #respuestaAyuda,
  #planTexto {
    padding: var(--space-2h);
  }
}

@media (max-width: 420px) {
  .logo-title {
    font-size: 1.45rem;
  }

  .wizard-title {
    font-size: 1.08rem;
  }

  .wizard-sub,
  .wizard-help,
  .sec-body,
  .bullets li,
  .task-accion,
  .co-content {
    font-size: var(--text-body);
  }
}

#objetivoVivoBox,
#diagnosticoBox {
  display: none !important;
}

/* =============================================
   Bilingual text overflow handling
   ============================================= */

/* EN text tends to be longer - ensure buttons don't overflow */
.auth-links a,
.btn-primario,
.btn-secundario,
.btn {
  overflow-wrap: break-word;
  word-break: break-word;
}

/* Auth links row wrapping for longer EN text */
.auth-links {
  flex-wrap: wrap;
  justify-content: center;
}

/* Wizard stepper - ensure labels truncate gracefully */
.stepper-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Closure hero - responsive text */
.closure-hero h2 {
  word-break: break-word;
}

/* =============================================
   Mobile fixes (480px, 420px)
   ============================================= */

@media (max-width: 480px) {
  .evidence-metrics-row {
    flex-direction: column;
    gap: var(--space-1h);
  }
  .evidence-metrics-row > div {
    width: 100%;
  }
  .evidence-metrics-row input {
    width: 100% !important;
  }
}

@media (max-width: 420px) {
  textarea {
    min-height: 70px;
  }
  .wizard-textarea {
    min-height: 65px;
  }
  .wizard-textarea--sm {
    min-height: var(--space-7);
  }
  .btn-primario,
  .btn-secundario,
  .btn {
    padding: 0.55rem 0.9rem;
    font-size: var(--text-body);
  }
  .botonera-dia {
    gap: var(--space-1);
  }
}

/* =============================================
   Toast types (success, warning, error)
   ============================================= */

.toast--success {
  background: linear-gradient(135deg, #059669, #10b981) !important;
  border-left: var(--space-0) solid #047857;
}

.toast--warning {
  background: linear-gradient(135deg, #d97706, #f59e0b) !important;
  border-left: var(--space-0) solid #b45309;
}

.toast--error {
  background: linear-gradient(135deg, #dc2626, #ef4444) !important;
  border-left: var(--space-0) solid #b91c1c;
}

/* =============================================
   Button loading state
   ============================================= */

.btn-loading {
  pointer-events: none;
  opacity: 0.7;
  position: relative;
}

.btn-loading::after {
  content: "";
  display: inline-block;
  width: var(--space-3);
  height: var(--space-3);
  margin-left: var(--space-1h);
  border: var(--space-px) solid rgba(255,255,255,0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: loaderSpin 0.6s linear infinite;
  vertical-align: middle;
}

/* =============================================
   Sprint 30 Closure Celebration Screen
   ============================================= */

.closure-hero {
  background: linear-gradient(135deg, #1E3A8A, #10B981);
  border-radius: 16px;
  padding: 2rem 1.5rem;
  text-align: center;
  color: white;
  margin-bottom: 1.5rem;
  position: relative;
  overflow: hidden;
}

.closure-hero h2 {
  font-size: var(--text-4xl);
  font-weight: 800;
  margin: 0 0 0.5rem 0;
}

.closure-hero p {
  font-size: var(--text-md);
  opacity: 0.9;
  margin: 0;
}

.closure-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-2h);
  margin-bottom: 1.5rem;
}

@media (min-width: 640px) {
  .closure-stats-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.closure-stat-card {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 12px;
  padding: 1rem;
  text-align: center;
}

.closure-stat-card .stat-number {
  font-size: var(--text-3xl);
  font-weight: 800;
  color: #10B981;
  display: block;
}

.closure-stat-card .stat-label {
  font-size: var(--text-sm);
  opacity: 0.8;
  margin-top: var(--space-0);
}

.closure-achievements-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1h);
  margin-bottom: 1.5rem;
  justify-content: center;
}

.closure-achievement-badge {
  background: rgba(16, 185, 129, 0.12);
  border: 1px solid rgba(16, 185, 129, 0.25);
  border-radius: var(--radius-xl);
  padding: var(--space-1) var(--space-3);
  font-size: var(--text-sm);
  font-weight: 600;
  color: #10B981;
}

.closure-section {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 1.2rem;
  margin-bottom: 1rem;
}

.closure-section h4 {
  margin: 0 0 0.5rem 0;
  font-weight: 700;
}

.closure-momentum-cta {
  background: linear-gradient(135deg, #1E3A8A, #3B82F6);
  border-radius: 16px;
  padding: 1.5rem;
  text-align: center;
  color: white;
  margin-top: 1.5rem;
}

.closure-momentum-cta h3 {
  font-size: var(--text-xl);
  margin: 0 0 0.5rem 0;
}

.closure-momentum-cta p {
  opacity: 0.9;
  margin: 0 0 1rem 0;
  font-size: var(--text-base);
}

.closure-momentum-cta .btn-primario {
  background: #10B981;
  border: none;
  padding: 0.8rem 2rem;
  font-size: var(--text-md);
  border-radius: var(--radius-md);
  cursor: pointer;
  font-weight: 700;
  color: white;
}

/* Language toggle */
.lang-toggle {
  display: inline-flex;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: var(--radius-xl);
  overflow: hidden;
  font-size: var(--text-xs-plus);
  margin-left: var(--space-2h);
}

.lang-toggle button {
  background: transparent;
  border: none;
  color: inherit;
  padding: var(--space-0) var(--space-2);
  cursor: pointer;
  font-weight: 600;
  font-size: var(--text-xs-plus);
  opacity: 0.6;
  transition: all 0.2s;
}

.lang-toggle button.active {
  background: rgba(255,255,255,0.15);
  opacity: 1;
}

/* =========================================
   ENTRY HUB: pantalla de entrada restructurada
   ========================================= */

/* Entry hub: vive sobre fondo navy oscuro (auth-mode), texto blanco premium */
.entry-divider {
  display: flex;
  align-items: center;
  gap: var(--space-3h);
  margin: var(--space-6) auto var(--space-5);
  max-width: 480px;
}

.entry-divider-line {
  flex: 1;
  height: 1px;
  background: rgba(255, 255, 255, 0.18);
}

.entry-divider-text {
  color: rgba(255, 255, 255, 0.72);
  font-size: var(--text-sm);
  font-weight: 600;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.entry-options-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
  max-width: 720px;
  margin: 0 auto;
}

.entry-options-3col {
  grid-template-columns: 1fr 1fr 1fr;
  max-width: 880px;
  gap: var(--space-4h);
}

/* Phase 11 — 4-card value ladder: Free / Map / Sprint / Momentum (2x2) */
.entry-options-4col {
  grid-template-columns: 1fr 1fr;
  max-width: 880px;
  gap: var(--space-4h);
}

@media (max-width: 768px) {
  .entry-options-3col,
  .entry-options-4col { grid-template-columns: 1fr; max-width: 440px; }
}

.entry-option-card {
  background: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  padding: 28px 22px 24px;
  text-align: center;
  cursor: pointer;
  transition: transform 0.2s var(--ease-out), box-shadow 0.25s var(--ease-out);
  box-shadow: 0 14px 32px -8px rgba(0, 0, 0, 0.35),
              0 4px 12px -2px rgba(0, 0, 0, 0.18);
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.entry-option-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 48px -12px rgba(0, 0, 0, 0.45),
              0 8px 18px -4px rgba(0, 0, 0, 0.25);
}

/* Sprint30 — el "default" azul */
.entry-option-primary {
  border-top: 3px solid #2563eb;
}

/* Badge centrado arriba como ribbon — no en esquina */
.entry-option-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 800;
  padding: var(--space-1) var(--space-3h);
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  box-shadow: 0 6px 18px -4px rgba(37, 99, 235, 0.55);
  white-space: nowrap;
}

/* Phase 11 — color modifiers per tier badge */
.entry-option-badge--free {
  background: linear-gradient(135deg, #10b981, #059669);
  box-shadow: 0 6px 18px -4px rgba(16, 185, 129, 0.55);
}
.entry-option-badge--new {
  background: linear-gradient(135deg, #6366f1, #4f46e5);
  box-shadow: 0 6px 18px -4px rgba(99, 102, 241, 0.55);
}
.entry-option-badge--premium {
  background: linear-gradient(135deg, #f59e0b, #d97706);
  box-shadow: 0 6px 18px -4px rgba(245, 158, 11, 0.55);
}

.entry-option-title {
  margin: var(--space-1) 0 var(--space-2);
  font-size: var(--text-xl);
  font-weight: 800;
  color: #0b1430;
  letter-spacing: -0.01em;
}

.entry-option-desc {
  margin: 0 0 16px;
  font-size: var(--text-sm);
  color: #5a6b88;
  line-height: 1.5;
  flex: 1;
}

.entry-option-price {
  display: block;
  font-size: 1.65rem;
  font-weight: 800;
  color: #0b1430;
  margin: var(--space-0) 0 var(--space-3h);
  letter-spacing: -0.02em;
}

.entry-option-cta {
  display: inline-block;
  padding: 11px 26px;
  border-radius: var(--radius-md);
  font-size: var(--text-body);
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  transition: transform 0.15s ease, box-shadow 0.2s ease;
  box-shadow: 0 6px 16px -4px rgba(37, 99, 235, 0.45);
  letter-spacing: 0.01em;
}
.entry-option-card:hover .entry-option-cta {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px -6px rgba(37, 99, 235, 0.55);
}

/* Diagnosis — outlined / ghost neutral, NO gris dark */
.entry-option-secondary {
  border-top: 3px solid #94a3b8;
}
.entry-option-secondary .entry-option-cta {
  background: transparent;
  color: #1e3a6e;
  border: 1.5px solid rgba(37, 99, 235, 0.35);
  box-shadow: none;
}
.entry-option-card:hover .entry-option-secondary .entry-option-cta {
  background: rgba(37, 99, 235, 0.05);
}

/* Phase 11 — Free Diagnosis: emerald accent, ghost CTA */
.entry-option-free {
  border-top: 3px solid #10b981;
}
.entry-option-cta--ghost {
  background: transparent !important;
  color: #1e3a6e !important;
  border: 1.5px solid rgba(37, 99, 235, 0.35);
  box-shadow: none !important;
}
.entry-option-card:hover .entry-option-cta--ghost {
  background: rgba(37, 99, 235, 0.05) !important;
}

/* Phase 11 — Execution Map: indigo accent, premium intermediate tier */
.entry-option-map {
  border-top: 3px solid #6366f1;
}
.entry-option-map .entry-option-price {
  background: linear-gradient(135deg, #4f46e5, #4338ca);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.entry-option-cta--map {
  background: linear-gradient(135deg, #6366f1, #4f46e5) !important;
  color: #fff !important;
  box-shadow: 0 6px 16px -4px rgba(99, 102, 241, 0.45) !important;
}
.entry-option-card:hover .entry-option-cta--map {
  box-shadow: 0 10px 22px -6px rgba(99, 102, 241, 0.55) !important;
}

/* Momentum90 — visiblemente PREMIUM: gold accent + indigo glow */
.entry-option-momentum {
  border-top: 3px solid #f59e0b;
  background: linear-gradient(180deg, #ffffff 0%, #fefcf6 100%);
  box-shadow: 0 14px 38px -8px rgba(245, 158, 11, 0.35),
              0 6px 16px -4px rgba(79, 70, 229, 0.18);
}
.entry-option-momentum:hover {
  box-shadow: 0 26px 56px -14px rgba(245, 158, 11, 0.45),
              0 10px 22px -6px rgba(79, 70, 229, 0.25);
}
.entry-option-momentum .entry-option-price {
  background: linear-gradient(135deg, #d97706, #b45309);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.entry-option-cta-momentum {
  background: linear-gradient(135deg, #f59e0b, #d97706) !important;
  color: #fff !important;
  box-shadow: 0 8px 22px -4px rgba(245, 158, 11, 0.55) !important;
}
.entry-option-card:hover .entry-option-cta-momentum {
  box-shadow: 0 12px 28px -6px rgba(245, 158, 11, 0.65) !important;
}

/* Phase 11 — Premium badge ahora se renderiza vía HTML (entry-option-badge--premium)
   para mantener consistencia con los otros 3 cards y permitir i18n. El pseudo
   ::before previo se removió para evitar doble badge. */

.entry-momentum-note {
  max-width: 640px;
  margin: 28px auto 0;
  padding: var(--space-3) 22px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 12px;
  text-align: center;
  backdrop-filter: blur(6px);
}

.entry-momentum-note p {
  margin: 0;
  font-size: var(--text-sm);
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.55;
}

.entry-momentum-note strong {
  color: #ffffff;
  font-weight: 700;
}

.entry-status-link {
  text-align: center;
  margin-top: 22px;
  padding-bottom: var(--space-1h);
}

.entry-status-link a {
  color: rgba(255, 255, 255, 0.72);
  font-size: var(--text-sm);
  font-weight: 500;
  text-decoration: none;
  transition: color 0.15s;
}

.entry-status-link a:hover {
  color: #ffffff;
  text-decoration: underline;
}

/* Waitlist enhanced screen */
.waitlist-card {
  text-align: center;
}

.waitlist-icon {
  font-size: 2.5rem;
  margin-bottom: var(--space-1h);
}

.waitlist-message {
  color: #4a6494;
  font-size: var(--text-base);
  line-height: 1.5;
  margin: var(--space-2h) 0 var(--space-4h);
}

.waitlist-actions {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-top: var(--space-3h);
}

@media (max-width: 640px) {
  .entry-options-3col {
    grid-template-columns: 1fr 1fr;
    max-width: 520px;
  }
  .entry-options-3col .entry-option-secondary {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .entry-options-row,
  .entry-options-3col,
  .entry-options-4col {
    grid-template-columns: 1fr;
    max-width: 400px;
  }
  .entry-option-card {
    padding: var(--space-4h) 16px;
  }
  .entry-options-3col .entry-option-secondary {
    grid-column: auto;
  }
}

/* Safe area for notched phones */
@supports (padding: env(safe-area-inset-top)) {
  body {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
  }
  #mensajeFlotante {
    top: max(18px, env(safe-area-inset-top));
  }
}

/* ============================
   1.1 Progress Chart
   ============================ */
.chart-container {
  margin: var(--space-2h) 0 var(--space-1h);
  padding: var(--space-3);
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(15,23,42,0.08);
  border-radius: 12px;
  max-height: 240px;
  position: relative;
}
.chart-container canvas {
  width: 100% !important;
  max-height: 200px;
}

/* ============================
   1.2 Streak Calendar
   ============================ */
.streak-calendar-container {
  margin: var(--space-2) 0 var(--space-1);
}
.streak-calendar-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}
.streak-day {
  width: var(--space-4);
  height: var(--space-4);
  border-radius: 4px;
  background: rgba(15,23,42,0.06);
  transition: transform 0.15s ease;
  position: relative;
}
.streak-day:hover {
  transform: scale(1.4);
  z-index: var(--z-above);
}
.streak-day[title]:hover::after {
  content: attr(title);
  position: absolute;
  bottom: 120%;
  left: 50%;
  transform: translateX(-50%);
  background: #1e293b;
  color: #fff;
  font-size: var(--text-xs);
  padding: var(--space-px) var(--space-1);
  border-radius: 4px;
  white-space: nowrap;
  pointer-events: none;
  z-index: var(--z-float);
}
.streak-day.completed {
  background: #10b981;
}
.streak-day.skipped {
  background: #f59e0b;
}
.streak-day.debt {
  background: #ef4444;
}
.streak-day.today {
  box-shadow: 0 0 0 2px #3b82f6;
  animation: streakPulse 1.5s ease-in-out infinite;
}
@keyframes streakPulse {
  0%, 100% { box-shadow: 0 0 0 2px #3b82f6; }
  50% { box-shadow: 0 0 0 4px rgba(59,130,246,0.4); }
}
.streak-calendar-label {
  font-size: var(--text-xs);
  font-weight: 600;
  color: #64748b;
  margin-bottom: var(--space-0);
}

/* ============================
   1.3 Phase Celebration Modal
   ============================ */
.phase-celebration-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-celebration);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15,23,42,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  animation: celebFadeIn 0.4s ease;
}
.phase-celebration-overlay.hidden { display: none; }
@keyframes celebFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.phase-celebration-content {
  background: #fff;
  border-radius: var(--radius-xl);
  padding: 36px 28px;
  max-width: 420px;
  width: 90%;
  text-align: center;
  position: relative;
  overflow: hidden;
  animation: celebSlideUp 0.5s cubic-bezier(0.34,1.56,0.64,1);
  box-shadow: 0 24px 60px rgba(0,0,0,0.25);
}
@keyframes celebSlideUp {
  from { opacity: 0; transform: translateY(40px) scale(0.95); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.phase-celebration-badge {
  font-size: 3rem;
  margin-bottom: var(--space-1h);
}
.phase-celebration-title {
  font-size: var(--text-2xl);
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 16px;
}
.phase-celebration-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-1h);
  margin: var(--space-3h) 0;
}
.celeb-stat {
  background: rgba(59,130,246,0.06);
  border: 1px solid rgba(59,130,246,0.15);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-1h);
  text-align: center;
}
.celeb-stat-value {
  font-size: var(--text-3xl);
  font-weight: 800;
  color: #1d4ed8;
}
.celeb-stat-label {
  font-size: var(--text-xs);
  font-weight: 600;
  color: #64748b;
  margin-top: var(--space-px);
}
.phase-celebration-next {
  font-size: var(--text-body);
  color: #475569;
  margin: var(--space-3h) 0 var(--space-4h);
  line-height: 1.5;
}
/* Confetti */
.confetti-container {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.confetti-piece {
  position: absolute;
  width: var(--space-1h);
  height: var(--space-1h);
  top: -10px;
  border-radius: 2px;
  animation: confettiFall var(--duration) linear forwards;
}
@keyframes confettiFall {
  0% { transform: translateY(0) rotate(0deg); opacity: 1; }
  100% { transform: translateY(500px) rotate(720deg); opacity: 0; }
}

/* ============================
   1.4 Achievement Fullscreen Overlay
   ============================ */
.achievement-fullscreen-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-celebration);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15,23,42,0.75);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  animation: achieveFadeIn 0.3s ease;
}
.achievement-fullscreen-overlay.hidden { display: none; }
@keyframes achieveFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.achievement-fullscreen-content {
  text-align: center;
  animation: achieveScaleIn 0.6s cubic-bezier(0.34,1.56,0.64,1);
}
@keyframes achieveScaleIn {
  from { opacity: 0; transform: scale(0.5); }
  to { opacity: 1; transform: scale(1); }
}
.achievement-glow {
  font-size: 5rem;
  filter: drop-shadow(0 0 30px rgba(251,191,36,0.6));
  animation: achieveGlow 1.5s ease-in-out infinite alternate;
}
@keyframes achieveGlow {
  from { filter: drop-shadow(0 0 20px rgba(251,191,36,0.4)); }
  to { filter: drop-shadow(0 0 40px rgba(251,191,36,0.8)); }
}
.achievement-fullscreen-name {
  font-size: var(--text-4xl);
  font-weight: 800;
  color: #fff;
  margin-top: var(--space-3h);
  text-shadow: 0 2px 12px rgba(0,0,0,0.3);
}
.achievement-fullscreen-desc {
  font-size: var(--text-md);
  color: rgba(255,255,255,0.8);
  margin-top: var(--space-1h);
}

/* ============================
   Estado Vivo Panel
   ============================ */
.estado-vivo-panel {
  margin: 0 0 16px;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.estado-vivo-panel.hidden { display: none; }

/* ═══ Business Dashboard — premium light theme (Apr 2026 audit) ═══ */
.ev-dashboard {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 22px 22px;
  color: var(--ink);
  box-shadow: 0 8px 24px -8px rgba(11, 20, 48, 0.10),
              0 2px 6px -2px rgba(11, 20, 48, 0.06);
}
.ev-dashboard-title {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--ink-mute);
  margin-bottom: var(--space-3h);
}

/* Metrics row — big numbers */
.ev-metrics-row {
  display: flex;
  gap: var(--space-0);
  margin-bottom: var(--space-4h);
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  padding: var(--space-3) var(--space-2);
}
.ev-metric {
  flex: 1;
  text-align: center;
}
.ev-metric-number {
  font-size: 1.55rem;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.2;
  letter-spacing: -0.02em;
}
.ev-metric-sales {
  color: var(--success);
}
.ev-metric-label {
  font-size: 0.66rem;
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-top: var(--space-0);
  font-weight: 600;
}
.ev-metric-momentum {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.ev-metric-dot {
  width: var(--space-2h);
  height: var(--space-2h);
  border-radius: 50%;
  margin-bottom: var(--space-0);
}

/* BUCKETS V2 (audit 2026-04-09): subtitulo "en este sprint" debajo de los
   numeros grandes para dejar claro que esos contadores son intra-sprint, no
   el total historico del negocio. El sub-caption del baseline se renderiza
   solo si el usuario declaro linea base al Dia 1. */
.ev-sprint-subtitle {
  text-align: center;
  font-size: 0.68rem;
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  margin-top: -12px;
  margin-bottom: var(--space-2);
}
.ev-baseline-subcaption {
  text-align: center;
  font-size: var(--text-xs-plus);
  color: var(--ink-soft);
  font-style: italic;
  margin-top: -4px;
  margin-bottom: var(--space-3);
  padding: var(--space-1) var(--space-2);
  background: rgba(99, 102, 241, 0.04);
  border-radius: 8px;
  border-left: var(--space-px) solid rgba(99, 102, 241, 0.25);
}

/* Business dimensions with progress bars */
.ev-dimensions {
  display: flex;
  flex-direction: column;
  gap: var(--space-2h);
}
.ev-dim {}
.ev-dim-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: var(--space-0);
}
.ev-dim-name {
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--ink);
}
.ev-dim-status {
  font-size: 0.68rem;
  font-weight: 800;
  color: var(--indigo-strong);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.ev-progress-track {
  height: var(--space-1h);
  background: rgba(11, 20, 48, 0.08);
  border-radius: 999px;
  overflow: hidden;
}
.ev-progress-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--primary), var(--indigo));
  transition: width 0.6s var(--ease-out);
}
.ev-dim-detail {
  font-size: var(--text-xs-plus);
  color: var(--ink-soft);
  margin-top: var(--space-0);
  line-height: 1.45;
}
.ev-dim-guide {
  font-size: var(--text-xs-plus);
  color: var(--indigo);
  margin-top: var(--space-0);
  font-style: italic;
  line-height: 1.4;
}

/* Blocker */
.ev-blocker {
  margin-top: var(--space-3h);
  display: flex;
  gap: var(--space-2);
  align-items: flex-start;
  background: rgba(220, 38, 38, 0.06);
  border: 1px solid rgba(220, 38, 38, 0.20);
  border-left: var(--space-0) solid var(--danger);
  border-radius: var(--radius-md);
  padding: var(--space-2h) var(--space-3);
}
.ev-blocker-icon { font-size: var(--text-lg); flex-shrink: 0; }
.ev-blocker-content { flex: 1; min-width: 0; }
.ev-blocker-label {
  font-size: 0.66rem;
  font-weight: 800;
  color: var(--danger);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.ev-blocker-text {
  font-size: var(--text-body);
  color: #7f1d1d;
  margin-top: var(--space-px);
  line-height: 1.45;
}

/* Cohort position card (audit 2026-05-04 P2-15) */
.ev-cohort-pos {
  margin-top: var(--space-3h);
  display: flex;
  gap: var(--space-2);
  align-items: flex-start;
  background: rgba(99, 102, 241, 0.06);
  border: 1px solid rgba(99, 102, 241, 0.20);
  border-left: 3px solid #6366f1;
  border-radius: var(--radius-md);
  padding: var(--space-2h) var(--space-3);
}
.ev-cohort-pos.cohort-pos-at_risk {
  background: rgba(220, 38, 38, 0.06);
  border-color: rgba(220, 38, 38, 0.20);
  border-left-color: var(--danger);
}
.ev-cohort-pos.cohort-pos-warning {
  background: rgba(245, 158, 11, 0.07);
  border-color: rgba(245, 158, 11, 0.25);
  border-left-color: #f59e0b;
}
.ev-cohort-pos.cohort-pos-ahead {
  background: rgba(16, 185, 129, 0.07);
  border-color: rgba(16, 185, 129, 0.25);
  border-left-color: #10b981;
}
.ev-cohort-icon { font-size: var(--text-lg); flex-shrink: 0; }
.ev-cohort-content { flex: 1; min-width: 0; }
.ev-cohort-label {
  font-size: 0.7rem;
  font-weight: 800;
  color: #4338ca;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.ev-cohort-risk { font-weight: 800; color: inherit; }
.ev-cohort-pos.cohort-pos-at_risk .ev-cohort-label,
.ev-cohort-pos.cohort-pos-at_risk .ev-cohort-risk { color: #b91c1c; }
.ev-cohort-pos.cohort-pos-warning .ev-cohort-label,
.ev-cohort-pos.cohort-pos-warning .ev-cohort-risk { color: #b45309; }
.ev-cohort-pos.cohort-pos-ahead .ev-cohort-label,
.ev-cohort-pos.cohort-pos-ahead .ev-cohort-risk { color: #047857; }
.ev-cohort-lever {
  font-size: var(--text-body);
  margin-top: var(--space-px);
  line-height: 1.45;
  color: #1f2937;
}
.ev-cohort-lever strong { font-weight: 700; }

/* M90 premium dashboard — light theme con accent gold (Apr 2026) */
.tier-momentum .ev-dashboard {
  background: linear-gradient(180deg, #ffffff 0%, #fefcf6 100%);
  border-color: rgba(245, 158, 11, 0.30);
  border-top: 3px solid var(--gold);
  box-shadow: 0 14px 38px -8px rgba(245, 158, 11, 0.18),
              0 6px 16px -4px rgba(11, 20, 48, 0.08);
}
.tier-momentum .ev-dim-status { color: var(--gold-strong); }
.tier-momentum .ev-metric-sales { color: var(--gold-strong); }

@media (max-width: 480px) {
  .ev-metrics-row { gap: var(--space-px); padding: var(--space-1h) var(--space-0); }
  .ev-metric-number { font-size: var(--text-lg); }
  .ev-dashboard { padding: var(--space-3) var(--space-2h); }
}

/* ═══════════════════════════════════════════
   BUSINESS TIMELINE — "The story of your business"
   ═══════════════════════════════════════════ */

/* Premium audit Apr 2026: biz-timeline convertido a light theme */
.biz-timeline {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 22px;
  margin-bottom: var(--space-3h);
  box-shadow: 0 8px 24px -8px rgba(11, 20, 48, 0.10),
              0 2px 6px -2px rgba(11, 20, 48, 0.06);
}
.biz-timeline-title {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--ink-mute);
  margin-bottom: var(--space-3h);
}
.biz-narrative-summary {
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  border-left: 3px solid var(--indigo);
  border-radius: var(--radius-md);
  padding: var(--space-2h) var(--space-3h);
  margin-bottom: var(--space-3h);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.biz-narrative-line {
  font-size: var(--text-sm);
  color: var(--ink-soft);
  line-height: 1.5;
}
.biz-narrative-line strong {
  color: var(--ink);
  font-weight: 700;
}
.biz-timeline-track {
  position: relative;
  padding-left: 22px;
  border-left: var(--space-px) solid rgba(11, 20, 48, 0.10);
}
.biz-timeline-event {
  position: relative;
  padding-bottom: var(--space-3h);
  display: flex;
  gap: var(--space-2h);
  align-items: flex-start;
}
.biz-timeline-event:last-child { padding-bottom: 0; }
.biz-timeline-dot {
  position: absolute;
  left: -27px;
  top: var(--space-0);
  width: var(--space-2h);
  height: var(--space-2h);
  border-radius: 50%;
  flex-shrink: 0;
  border: var(--space-px) solid #ffffff;
  box-shadow: 0 0 0 1px rgba(11, 20, 48, 0.12);
}
.biz-timeline-content { flex: 1; }
.biz-timeline-day {
  font-size: 0.68rem;
  font-weight: 800;
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.biz-timeline-text {
  font-size: var(--text-body);
  color: var(--ink);
  line-height: 1.5;
  margin-top: var(--space-px);
}
.biz-timeline-detail {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  margin-top: 3px;
}

/* M90 timeline treatment — light + gold accent */
.tier-momentum .biz-timeline {
  background: linear-gradient(180deg, #ffffff 0%, #fefcf6 100%);
  border-color: rgba(245, 158, 11, 0.25);
  border-top: 3px solid var(--gold);
}
.tier-momentum .biz-timeline-track {
  border-left-color: rgba(245, 158, 11, 0.30);
}

/* ═══════════════════════════════════════════
   PREMIUM INSIGHT BLOCK — M90 strategic insight
   ═══════════════════════════════════════════ */
.premium-insight-block {
  background: linear-gradient(135deg, rgba(79,70,229,0.10) 0%, rgba(251,191,36,0.06) 100%);
  border: 1px solid rgba(167,139,250,0.25);
  border-left: var(--space-0) solid #fbbf24;
  border-radius: 12px;
  padding: var(--space-3) var(--space-3h);
  margin-top: var(--space-1h);
}
.premium-insight-badge {
  display: inline-block;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: #fbbf24;
  background: rgba(251,191,36,0.12);
  border: 1px solid rgba(251,191,36,0.3);
  padding: var(--space-px) var(--space-1h);
  border-radius: 4px;
  margin-bottom: var(--space-1h);
}
.premium-insight-title {
  font-size: var(--text-sm);
  font-weight: 700;
  color: #4c1d95;
  margin-bottom: var(--space-1);
}
.premium-insight-text {
  font-size: var(--text-base);
  color: #5b21b6;
  line-height: 1.55;
}

/* ============================
   Intervention Cards
   ============================ */
/* Legacy — kept for backward compat */
.intervention-card {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-2h) var(--space-3);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-1h);
  font-size: var(--text-body);
  line-height: 1.45;
}
.intervention-warning {
  background: rgba(245,158,11,0.08);
  border: 1px solid rgba(245,158,11,0.25);
  color: #92400e;
}
.intervention-positive {
  background: rgba(16,185,129,0.08);
  border: 1px solid rgba(16,185,129,0.25);
  color: #065f46;
}
.intervention-icon {
  font-size: var(--text-xl);
  flex-shrink: 0;
  margin-top: 1px;
}
.intervention-text {
  flex: 1;
}

/* ═══ Movement 2: Intervention Dialogs ═══ */
.intervention-dialog {
  border-radius: 12px;
  padding: var(--space-3) var(--space-3h);
  margin-bottom: var(--space-2);
}
.intervention-dialog-header {
  display: flex;
  align-items: center;
  gap: var(--space-1h);
  margin-bottom: var(--space-1h);
}
.intervention-dialog-icon { font-size: var(--text-lg); }
.intervention-dialog-title {
  font-size: var(--text-sm);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.intervention-dialog-body {
  font-size: var(--text-body);
  line-height: 1.5;
  margin-bottom: var(--space-2);
}
.intervention-action-btn {
  display: inline-block;
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-sm);
  border: none;
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
  transition: opacity 0.2s;
}
.intervention-action-btn:hover { opacity: 0.85; }

/* Tones */
.intervention-confrontation {
  background: rgba(239,68,68,0.06);
  border: 1px solid rgba(239,68,68,0.2);
  border-left: var(--space-0) solid #ef4444;
}
.intervention-confrontation .intervention-dialog-title { color: #fca5a5; }
.intervention-confrontation .intervention-dialog-body { color: #fecaca; }
.intervention-confrontation .intervention-action-btn { background: #ef4444; color: #fff; }

.intervention-warning {
  background: rgba(245,158,11,0.06);
  border: 1px solid rgba(245,158,11,0.2);
  border-left: var(--space-0) solid #f59e0b;
}
.intervention-dialog.intervention-warning .intervention-dialog-title { color: #fcd34d; }
.intervention-dialog.intervention-warning .intervention-dialog-body { color: #fef3c7; }
.intervention-dialog.intervention-warning .intervention-action-btn { background: #f59e0b; color: #1e293b; }

.intervention-pressure {
  background: rgba(99,102,241,0.06);
  border: 1px solid rgba(99,102,241,0.2);
  border-left: var(--space-0) solid #6366f1;
}
.intervention-pressure .intervention-dialog-title { color: #4338ca; }
.intervention-pressure .intervention-dialog-body { color: #3730a3; }
.intervention-pressure .intervention-action-btn { background: #6366f1; color: #fff; }

.intervention-celebration {
  background: rgba(16,185,129,0.06);
  border: 1px solid rgba(16,185,129,0.2);
  border-left: var(--space-0) solid #10b981;
}
.intervention-celebration .intervention-dialog-title { color: #6ee7b7; }
.intervention-celebration .intervention-dialog-body { color: #a7f3d0; }
.intervention-celebration .intervention-action-btn { background: #10b981; color: #fff; }

.intervention-insight {
  background: rgba(6,182,212,0.06);
  border: 1px solid rgba(6,182,212,0.2);
  border-left: var(--space-0) solid #06b6d4;
}
.intervention-insight .intervention-dialog-title { color: #67e8f9; }
.intervention-insight .intervention-dialog-body { color: #a5f3fc; }

.intervention-info {
  background: rgba(100,116,139,0.06);
  border: 1px solid rgba(100,116,139,0.2);
  border-left: var(--space-0) solid #64748b;
}
.intervention-info .intervention-dialog-title { color: var(--ink-mute-dark); }
.intervention-info .intervention-dialog-body { color: #e2e8f0; }

/* ═══ System Verdict (post-completion) ═══ */
.system-verdict {
  border-radius: 12px;
  padding: var(--space-3h) var(--space-4);
  margin-bottom: var(--space-3);
  animation: svSlideIn 0.4s ease-out;
}
@keyframes svSlideIn {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}
.sv-content {}
.sv-headline {
  font-size: var(--text-md);
  font-weight: 700;
  margin-bottom: var(--space-1h);
}
.sv-pattern {
  font-size: var(--text-body);
  padding: var(--space-1h) var(--space-2);
  border-radius: var(--radius-sm);
  margin-bottom: var(--space-1h);
  font-style: italic;
}
.sv-subtext {
  font-size: var(--text-body);
  line-height: 1.5;
  margin-bottom: var(--space-1h);
}
.sv-decision {
  font-size: var(--text-body);
  margin-bottom: var(--space-2);
}
.sv-dismiss {
  padding: 5px 14px;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(255,255,255,0.2);
  background: transparent;
  color: inherit;
  font-size: var(--text-xs-plus);
  cursor: pointer;
  opacity: 0.7;
}
.sv-dismiss:hover { opacity: 1; }

/* Verdict tones */
.sv-positive {
  background: linear-gradient(135deg, rgba(16,185,129,0.12) 0%, rgba(16,185,129,0.04) 100%);
  border: 1px solid rgba(16,185,129,0.25);
}
.sv-positive .sv-headline { color: #6ee7b7; }
.sv-positive .sv-subtext { color: #a7f3d0; }
.sv-positive .sv-decision { color: #10b981; }
.sv-positive .sv-pattern { background: rgba(16,185,129,0.08); color: #6ee7b7; }

.sv-neutral {
  background: linear-gradient(135deg, rgba(59,130,246,0.10) 0%, rgba(59,130,246,0.03) 100%);
  border: 1px solid rgba(59,130,246,0.25);
}
.sv-neutral .sv-headline { color: #93c5fd; }
.sv-neutral .sv-subtext { color: #bfdbfe; }
.sv-neutral .sv-decision { color: #3b82f6; }
.sv-neutral .sv-pattern { background: rgba(59,130,246,0.08); color: #93c5fd; }

.sv-warning {
  background: linear-gradient(135deg, rgba(245,158,11,0.10) 0%, rgba(245,158,11,0.03) 100%);
  border: 1px solid rgba(245,158,11,0.25);
}
.sv-warning .sv-headline { color: #fcd34d; }
.sv-warning .sv-subtext { color: #fef3c7; }
.sv-warning .sv-decision { color: #f59e0b; }
.sv-warning .sv-pattern { background: rgba(245,158,11,0.08); color: #fcd34d; }

.sv-critical {
  background: linear-gradient(135deg, rgba(239,68,68,0.10) 0%, rgba(239,68,68,0.03) 100%);
  border: 1px solid rgba(239,68,68,0.25);
}
.sv-critical .sv-headline { color: #fca5a5; }
.sv-critical .sv-subtext { color: #fecaca; }
.sv-critical .sv-decision { color: #ef4444; }
.sv-critical .sv-pattern { background: rgba(239,68,68,0.08); color: #fca5a5; }

/* Verdict review mode */
.sv-review { opacity: 0.92; }
.btn-review-verdict {
  font-size: var(--text-xs);
  padding: var(--space-0) var(--space-2);
  border: 1px solid #cbd5e1;
  border-radius: var(--radius-sm);
  background: #f8fafc;
  color: #475569;
  cursor: pointer;
}
.btn-review-verdict:hover { background: #e2e8f0; }

/* ═══ Policy Decisions Bar ═══ */
.policy-decisions-bar {
  margin: var(--space-2) 0;
  padding: var(--space-2) var(--space-3);
  background: rgba(245, 158, 11, 0.06);
  border-left: 3px solid #f59e0b;
  border-radius: 8px;
}

/* ═══ Revenue Narrative Chain ═══ */
.revenue-narrative {
  margin-top: var(--space-2);
  padding: var(--space-2) 0;
  border-top: 1px solid #f1f5f9;
}
.rn-label {
  font-size: var(--text-xs);
  color: var(--ink-mute);
  margin-bottom: var(--space-1);
}
.rn-chain {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-0) var(--space-1h);
  align-items: center;
  font-size: var(--text-xs-plus);
}
.rn-step {
  background: var(--chip-neutral);
  padding: var(--space-px) var(--space-1h);
  border-radius: 4px;
  font-weight: 600;
}
.rn-step--info { background: var(--chip-info); }
.rn-step--strong { font-weight: 700; }
.rn-arrow { color: var(--ink-mute); }

/* ═══ System Profile Dashboard ═══ */
.system-profile-panel { margin-bottom: var(--space-2h); }
.spd-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: var(--space-3) var(--space-3h);
}
.spd-header {
  font-weight: 700;
  font-size: var(--text-body);
  margin-bottom: var(--space-2);
  color: #0f172a;
}
.spd-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-1h);
}
.spd-dimension {
  background: #f8fafc;
  border-radius: 8px;
  padding: var(--space-1h) var(--space-2);
}
.spd-dimension-label {
  font-size: 0.68rem;
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: 600;
}
.spd-dimension-value {
  font-size: var(--text-sm);
  font-weight: 700;
  color: #1e293b;
  margin-top: var(--space-px);
}
.spd-dimension-explain {
  font-size: var(--text-xs);
  color: #64748b;
  margin-top: var(--space-px);
}
.spd-phase-row {
  display: flex;
  gap: var(--space-2h);
  margin-top: var(--space-2);
  padding-top: var(--space-1h);
  border-top: 1px solid #f1f5f9;
  font-size: var(--text-xs-plus);
}
.spd-health-row {
  margin-top: var(--space-1h);
  padding-top: var(--space-1h);
  border-top: 1px solid #f1f5f9;
}
@media (max-width: 480px) {
  .spd-grid { grid-template-columns: 1fr; }
}

/* ═══ Roadmap Timeline ═══ */
.roadmap-progress-panel { margin-bottom: var(--space-2h); }
.roadmap-timeline {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: var(--space-1h) 0;
}
.roadmap-item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-1) 0;
  position: relative;
}
.roadmap-item--completed .roadmap-dot { background: #10b981; }
.roadmap-item--current .roadmap-dot {
  background: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.2);
  animation: roadmapPulse 2s ease-in-out infinite;
}
.roadmap-item--future .roadmap-dot { background: #cbd5e1; }
.roadmap-dot {
  width: var(--space-2);
  height: var(--space-2);
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: var(--space-0);
}
@keyframes roadmapPulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.2); }
  50% { box-shadow: 0 0 0 6px rgba(37, 99, 235, 0.1); }
}

/* ═══════════════════════════════════════════
   MOVEMENT 4: Quick Complete + Evidence Quality
   ═══════════════════════════════════════════ */

.btn-quick-complete {
  font-size: var(--text-xs-plus) !important;
  opacity: 0.8;
  border-style: dashed !important;
}

.quick-complete-card {
  background: rgba(99,102,241,0.06);
  border: 1px solid rgba(99,102,241,0.2);
  border-radius: 12px;
  padding: var(--space-3) var(--space-3h);
}
.quick-complete-title {
  font-size: var(--text-body);
  font-weight: 700;
  color: #3730a3;
  margin-bottom: var(--space-2);
}
.quick-complete-options {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  margin-bottom: var(--space-1h);
}
.quick-option {
  padding: var(--space-1) var(--space-2h);
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(255,255,255,0.05);
  color: #e2e8f0;
  font-size: var(--text-sm);
  cursor: pointer;
  transition: all 0.2s;
}
.quick-option:hover {
  background: rgba(99,102,241,0.15);
  border-color: rgba(99,102,241,0.4);
}
.quick-option-active {
  background: rgba(99,102,241,0.25) !important;
  border-color: #6366f1 !important;
  color: #fff;
  font-weight: 600;
}

/* Evidence quality feedback — impact text */
.evidence-quality-feedback {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: var(--space-0);
  font-size: var(--text-xs-plus);
}
.evidence-quality-label {
  font-weight: 700;
}
.evidence-quality-impact {
  color: var(--ink-mute);
  font-style: italic;
  text-align: right;
}

@media (max-width: 480px) {
  .quick-complete-options { flex-direction: column; }
  .evidence-quality-feedback { flex-direction: column; gap: var(--space-px); }
  .evidence-quality-impact { text-align: left; }
}

/* ═══════════════════════════════════════════
   MOVEMENT 5: Phase Celebration Narrative + Context Prompt
   ═══════════════════════════════════════════ */

.celeb-stats-row {
  display: flex;
  justify-content: center;
  gap: var(--space-3h);
  margin-bottom: var(--space-3);
}
.celeb-narrative {
  font-size: var(--text-base);
  color: #e2e8f0;
  text-align: center;
  line-height: 1.5;
  margin-bottom: var(--space-2);
  padding: 0 12px;
}
.celeb-shift {
  font-size: var(--text-body);
  color: #4338ca;
  text-align: center;
  font-weight: 600;
  padding: var(--space-1h) var(--space-2h);
  background: rgba(99,102,241,0.1);
  border-radius: 8px;
  margin-bottom: var(--space-3);
}

/* Context update prompt */
.context-update-prompt {
  display: flex;
  gap: var(--space-2h);
  align-items: flex-start;
  background: rgba(6,182,212,0.06);
  border: 1px solid rgba(6,182,212,0.2);
  border-left: var(--space-0) solid #06b6d4;
  border-radius: 12px;
  padding: var(--space-3) var(--space-3h);
  margin-bottom: var(--space-2);
  animation: svSlideIn 0.4s ease-out;
}
.ctx-prompt-icon { font-size: var(--text-xl); flex-shrink: 0; }
.ctx-prompt-title {
  font-size: var(--text-body);
  font-weight: 700;
  color: #67e8f9;
  margin-bottom: var(--space-0);
}
.ctx-prompt-text {
  font-size: var(--text-sm);
  color: #a5f3fc;
  line-height: 1.45;
  margin-bottom: var(--space-1h);
}
.ctx-prompt-actions {
  display: flex;
  gap: var(--space-1);
  flex-wrap: wrap;
}
.btn-small {
  min-height: 44px;
  font-size: var(--text-xs-plus) !important;
  padding: var(--space-2) var(--space-2) !important;
}

/* ============================
   Weekly Summary Card
   ============================ */
.weekly-summary-card {
  background: linear-gradient(135deg, rgba(99,102,241,0.06), rgba(139,92,246,0.06));
  border: 1px solid rgba(99,102,241,0.2);
  border-radius: var(--radius-lg);
  padding: var(--space-3h) var(--space-4);
  margin-bottom: var(--space-2h);
}
.weekly-summary-header { margin-bottom: var(--space-1); }
.weekly-summary-badge {
  display: inline-flex;
  font-size: var(--text-xs);
  font-weight: 800;
  color: #4f46e5;
  background: rgba(99,102,241,0.12);
  padding: 3px 10px;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.weekly-summary-title {
  font-size: var(--text-lg);
  font-weight: 800;
  color: #1e1b4b;
  margin: var(--space-1) 0 var(--space-2);
}
.weekly-summary-metrics {
  display: flex;
  gap: var(--space-2h);
  margin-bottom: var(--space-2h);
}
.ws-metric {
  flex: 1;
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(99,102,241,0.12);
  border-radius: var(--radius-md);
  padding: var(--space-1h);
  text-align: center;
}
.ws-metric-val { font-size: var(--text-xl); font-weight: 800; color: #1e1b4b; display: block; }
.ws-metric-diff { font-size: var(--text-xs); font-weight: 700; display: block; margin-top: 1px; }
.ws-metric-label { font-size: 0.65rem; font-weight: 600; color: #64748b; text-transform: uppercase; display: block; margin-top: var(--space-px); }
.ws-insight {
  font-size: var(--text-sm);
  color: #334155;
  line-height: 1.5;
  margin-bottom: var(--space-1);
  padding-left: var(--space-0);
}
.ws-recommendation {
  background: rgba(16,185,129,0.06);
  border-radius: 8px;
  padding: var(--space-1h) var(--space-2);
  border: 1px solid rgba(16,185,129,0.15);
}
.ws-prediction {
  font-size: var(--text-xs-plus);
  font-style: italic;
  color: #6366f1;
  margin-top: var(--space-1h);
  font-weight: 600;
}

/* ============================
   Quick Help Suggestions (3C)
   ============================ */
.quick-help-container {
  margin: var(--space-1h) 0;
  padding: var(--space-2h);
  background: rgba(59,130,246,0.04);
  border: 1px solid rgba(59,130,246,0.12);
  border-radius: 12px;
}
.quick-help-container.hidden { display: none; }
.quick-help-title {
  font-size: var(--text-sm);
  font-weight: 700;
  color: #1e40af;
  margin-bottom: var(--space-1h);
}
.quick-help-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}
.quick-help-btn {
  font-size: var(--text-xs-plus);
  font-weight: 600;
  padding: var(--space-1) var(--space-2h);
  border: 1px solid rgba(59,130,246,0.25);
  border-radius: var(--radius-xl);
  background: #fff;
  color: #1d4ed8;
  cursor: pointer;
  transition: all 0.15s ease;
}
.quick-help-btn:hover {
  background: #1d4ed8;
  color: #fff;
  transform: translateY(-1px);
}
.quick-help-custom {
  border-style: dashed;
  color: #64748b;
  border-color: #94a3b8;
}
.quick-help-btn--structured {
  flex-direction: column;
  text-align: left;
  padding: var(--space-2) var(--space-3);
  flex: 1;
  min-width: 0;
  border-radius: 12px;
}
.quick-help-btn-title { font-weight: 700; font-size: var(--text-sm); }
.quick-help-btn-desc { font-size: var(--text-xs); opacity: 0.7; margin-top: var(--space-px); font-weight: 400; }

/* Recalibration diff banner */
.recalibration-diff {
  margin: var(--space-1h) 0 var(--space-2h);
  padding: var(--space-2h) var(--space-3);
  background: rgba(251, 191, 36, 0.08);
  border: 1px solid rgba(251, 191, 36, 0.25);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
}
.recalibration-diff .diff-title {
  font-weight: 700;
  color: #92400e;
  margin-bottom: var(--space-1);
}
.recalibration-diff .diff-item {
  margin: var(--space-0) 0;
}
.recalibration-diff .diff-dismiss {
  margin-top: var(--space-1h);
  font-size: var(--text-xs);
  cursor: pointer;
  color: #64748b;
}

/* ============================
   Dashboard Tabs
   ============================ */
.dashboard-tabs {
  display: flex;
  gap: var(--space-1);
  margin: var(--space-0) 0 var(--space-4);
  padding: var(--space-1);
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
}
.dashboard-tabs.hidden { display: none; }
.dash-tab {
  flex: 1;
  padding: var(--space-2) var(--space-3);
  font-size: var(--text-body);
  font-weight: 700;
  border: none;
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--ink-mute);
  cursor: pointer;
  transition: all 0.2s var(--ease-out);
  letter-spacing: 0.01em;
}
.dash-tab:hover {
  background: rgba(11, 20, 48, 0.04);
  color: var(--ink-soft);
}
.dash-tab.active {
  background: #ffffff;
  color: var(--primary-strong);
  box-shadow: 0 4px 14px -4px rgba(11, 20, 48, 0.18),
              0 1px 3px rgba(11, 20, 48, 0.08);
}
.tab-content { animation: tabFadeIn 0.25s ease; }
.tab-hidden { display: none !important; }
@keyframes tabFadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }

/* ============================
   Mobile Bottom Nav
   ============================ */
.mobile-bottom-nav {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: var(--z-nav);
  background: #fff;
  border-top: 1px solid rgba(15,23,42,0.08);
  padding: var(--space-1) 0;
  padding-bottom: max(6px, env(safe-area-inset-bottom));
  justify-content: space-around;
}
.mobile-bottom-nav.hidden { display: none !important; }
.mobile-nav-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-px);
  padding: var(--space-0) var(--space-3h);
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--ink-mute);
  transition: color 0.15s;
}
.mobile-nav-btn.active { color: #1d4ed8; }
.mobile-nav-icon { font-size: var(--text-xl); }
.mobile-nav-label { font-size: 0.65rem; font-weight: 700; }

@media (max-width: 640px) {
  .mobile-bottom-nav:not(.hidden) { display: flex; }
  .dashboard-tabs { display: none !important; }
  #pantallaProgreso { padding-bottom: 70px; }
}

/* ============================
   Momentum 90 Premium Theme
   ============================ */
.tier-momentum .journey-bar-fill {
  background: linear-gradient(90deg, #6366f1, #eab308) !important;
}
.tier-momentum .plan-card {
  border-left-color: #6366f1 !important;
  box-shadow: 0 0 0 1px rgba(99,102,241,0.1), 0 4px 16px rgba(99,102,241,0.08);
}
.tier-momentum .phase-badge {
  background: linear-gradient(135deg, #4f46e5, #7c3aed) !important;
}
.tier-badge-sprint {
  display: inline-flex;
  font-size: 0.66rem;
  font-weight: 800;
  padding: var(--space-0) var(--space-2h);
  border-radius: 999px;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #fff;
  margin-left: var(--space-1h);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  box-shadow: 0 4px 12px -3px rgba(37, 99, 235, 0.45);
}
.tier-badge-m90 {
  display: inline-flex;
  font-size: 0.66rem;
  font-weight: 800;
  padding: var(--space-0) var(--space-2h);
  border-radius: 999px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  color: #fff;
  margin-left: var(--space-1h);
  position: relative;
  overflow: hidden;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  box-shadow: 0 4px 14px -3px rgba(245, 158, 11, 0.55);
}
.tier-badge-m90::after {
  content: "";
  position: absolute;
  top: 0; left: -100%; width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
  animation: shimmer-slide 2.5s ease-in-out infinite;
}
@keyframes shimmer-slide {
  0% { left: -100%; }
  100% { left: 200%; }
}

/* ============================
   Onboarding Premium Screen
   ============================ */
/* Overlay fullscreen para onboarding premium — vive sobre todo */
.onboarding-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-5);
  background:
    radial-gradient(ellipse 60% 50% at 50% 30%, rgba(99, 102, 241, 0.25), transparent 70%),
    rgba(10, 21, 48, 0.92);
  backdrop-filter: blur(8px);
  animation: onboardingFadeIn 0.35s var(--ease-out);
}
.onboarding-overlay.hidden { display: none; }
@keyframes onboardingFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.onboarding-premium-card {
  max-width: 520px;
  width: 100%;
  padding: 40px 32px 32px;
  background: #ffffff;
  border-radius: 22px;
  box-shadow:
    0 40px 100px -20px rgba(0, 0, 0, 0.55),
    0 16px 40px -12px rgba(99, 102, 241, 0.25);
  animation: onboardingCardIn 0.45s var(--ease-spring);
}
@keyframes onboardingCardIn {
  from { opacity: 0; transform: translateY(20px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.onboarding-hero {
  text-align: center;
  font-size: var(--text-3xl);
  font-weight: 800;
  color: #0f172a;
  margin-bottom: var(--space-4h);
  line-height: 1.3;
}
.onboarding-features {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.onboarding-feature {
  display: flex;
  gap: var(--space-2h);
  align-items: flex-start;
}
.onboarding-feature-icon {
  font-size: var(--text-3xl);
  flex-shrink: 0;
  margin-top: var(--space-px);
}
.onboarding-feature strong {
  display: block;
  font-size: var(--text-base);
  color: #1e293b;
}
.onboarding-feature p {
  font-size: var(--text-sm);
  color: #64748b;
  margin: var(--space-px) 0 0;
  line-height: 1.4;
}

/* ============================
   Evidence Chat Toggle
   ============================ */
.btn-evidence-chat-toggle {
  background: rgba(99,102,241,0.15);
  border: 1px solid rgba(99,102,241,0.3);
  color: #4338ca;
  padding: 5px 12px;
  border-radius: var(--radius-xl);
  font-size: var(--text-xs-plus);
  cursor: pointer;
  transition: all 0.2s;
  font-weight: 500;
}
.btn-evidence-chat-toggle:hover {
  background: rgba(99,102,241,0.25);
  color: #312e81;
}

/* ============================
   Evidence Quality Indicator
   ============================ */
.evidence-quality-bar {
  display: flex;
  align-items: center;
  gap: var(--space-1h);
  margin-top: var(--space-1h);
  font-size: var(--text-xs-plus);
  font-weight: 600;
}
.evidence-quality-fill {
  flex: 1;
  height: var(--space-0);
  border-radius: 2px;
  background: rgba(15,23,42,0.06);
  overflow: hidden;
}
.evidence-quality-level {
  height: 100%;
  border-radius: 2px;
  transition: width 0.3s ease, background 0.3s ease;
}

/* ============================
   Evidence Task Fields (dynamic)
   ============================ */
.evidence-task-field {
  padding: var(--space-1h) var(--space-2);
  margin-bottom: var(--space-1);
  background: rgba(99,102,241,0.04);
  border: 1px solid rgba(99,102,241,0.12);
  border-radius: 8px;
}
.evidence-task-label {
  font-size: var(--text-xs-plus);
  font-weight: 700;
  color: #4f46e5;
  margin-bottom: var(--space-0);
}
.evidence-task-input {
  width: 100%;
  padding: var(--space-1) var(--space-1h);
  border: 1px solid #cbd5e1;
  border-radius: var(--radius-sm);
  font-size: var(--text-body);
}

/* ============================
   Wizard Tip
   ============================ */
.wizard-tip {
  font-size: var(--text-xs-plus);
  font-style: italic;
  color: #6366f1;
  background: rgba(99,102,241,0.06);
  border-left: 3px solid #6366f1;
  border-radius: 0 8px 8px 0;
  padding: var(--space-1h) var(--space-2h);
  margin: var(--space-1h) 0 var(--space-2h);
  line-height: 1.4;
}

/* ============================
   Rich History Cards
   ============================ */
.history-phase-header {
  font-weight: 700;
  font-size: var(--text-body);
  color: #334155;
  padding: var(--space-1h) 0 var(--space-0);
  margin-top: var(--space-2h);
  border-bottom: 1px solid rgba(15,23,42,0.06);
  list-style: none;
  display: flex;
  align-items: center;
  gap: var(--space-1h);
}
.history-card {
  list-style: none;
  padding: var(--space-1h) var(--space-2);
  margin: var(--space-0) 0;
  border-radius: 8px;
  border-left: 3px solid #e2e8f0;
  background: rgba(255,255,255,0.6);
  transition: transform 0.1s;
}
.history-card:hover { transform: translateX(2px); }
.hist-completed { border-left-color: #10b981; background: rgba(16,185,129,0.04); }
.hist-skipped { border-left-color: #f59e0b; background: rgba(245,158,11,0.04); }
.hist-debt { border-left-color: #ef4444; background: rgba(239,68,68,0.04); }
.history-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.history-card-day { font-weight: 700; font-size: var(--text-sm); color: #1e293b; }
.history-card-metrics {
  font-size: var(--text-xs);
  font-weight: 600;
  color: #64748b;
  background: rgba(15,23,42,0.04);
  padding: var(--space-px) var(--space-1);
  border-radius: var(--radius-sm);
}
.history-card-odd { font-size: var(--text-xs-plus); color: #475569; margin-top: 3px; line-height: 1.35; }
.history-card-pattern {
  font-size: var(--text-xs);
  color: #991b1b;
  margin-top: 3px;
  font-style: italic;
}
.history-expand-icon {
  font-size: var(--text-xs);
  color: var(--ink-mute);
  transition: transform 0.2s ease;
  display: inline-block;
  margin-left: auto;
}
.history-expand-icon.expanded { transform: rotate(90deg); }
.history-detail {
  margin-top: var(--space-1h);
  padding: var(--space-2) var(--space-2h);
  background: rgba(59,130,246,0.04);
  border-radius: 8px;
  border: 1px solid rgba(59,130,246,0.1);
}
.hd-section {
  font-size: var(--text-xs-plus);
  color: #334155;
  line-height: 1.45;
  margin-bottom: var(--space-1);
}
.hd-section:last-child { margin-bottom: 0; }
.hd-section strong { color: #1e293b; }
.history-summary {
  list-style: none;
  margin-top: var(--space-2h);
  padding: var(--space-2);
  background: rgba(59,130,246,0.04);
  border-radius: 8px;
  font-size: var(--text-body);
  color: #1e293b;
}

/* ============================
   Motivational Copy
   ============================ */
.motivational-copy {
  font-size: var(--text-xs-plus);
  font-weight: 600;
  font-style: italic;
  color: #6366f1;
  margin: var(--space-0) 0 var(--space-1);
  line-height: 1.4;
}

@media (max-width: 480px) {
  .ev-panel-grid { grid-template-columns: 1fr; }
  .weekly-summary-metrics { flex-direction: column; gap: var(--space-1); }
  .quick-help-buttons { flex-direction: column; }
  .onboarding-premium-card { padding: var(--space-5) var(--space-3h); }
}

/* ============================
   Mentor Reasoning Card
   ============================ */
.mentor-reasoning {
  background: linear-gradient(135deg, rgba(59,130,246,0.06), rgba(139,92,246,0.06));
  border-left: 3px solid #6366f1;
  border-radius: var(--radius-md);
  padding: var(--space-2h) var(--space-3);
  margin-bottom: var(--space-2h);
}
.mentor-reasoning-label {
  font-size: var(--text-xs-plus);
  font-weight: 700;
  color: #6366f1;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: var(--space-0);
}
.mentor-reasoning-text {
  font-size: var(--text-body);
  color: #334155;
  line-height: 1.55;
  font-style: italic;
}

/* ============================
   CORE V2: Decision Under Test
   ============================ */
.decision-test-box {
  background: linear-gradient(135deg, rgba(16,185,129,0.07), rgba(5,150,105,0.07));
  border-left: 3px solid #10b981;
  border-radius: var(--radius-md);
  padding: var(--space-2h) var(--space-3);
  margin-bottom: var(--space-2h);
}
.decision-test-box .sec-title {
  color: #059669;
  font-size: var(--text-sm);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.decision-test-box .sec-body {
  color: #064e3b;
  font-size: var(--text-base);
  line-height: 1.5;
}

/* ============================
   Decision Chain (yesterday → today)
   ============================ */
.decision-chain-box {
  background: linear-gradient(135deg, rgba(168,85,247,0.06), rgba(99,102,241,0.06));
  border-left: 3px solid #a855f7;
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
  margin-bottom: var(--space-2h);
}
.decision-chain-label { font-size: var(--text-xs); font-weight: 700; color: #7c3aed; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: var(--space-0); }
.decision-chain-signal { font-size: var(--text-body); font-weight: 600; margin-bottom: var(--space-0); }
.decision-chain-why { font-size: var(--text-sm); color: #475569; font-style: italic; margin-bottom: 3px; }
.decision-chain-outcome { font-size: var(--text-sm); font-weight: 600; color: #6d28d9; }
.decision-chain-metrics { font-size: var(--text-xs-plus); color: var(--ink-mute); margin-top: var(--space-0); }

/* ============================
   Business Memory Panel
   ============================ */
.bm-panel { margin: var(--space-2) 0 var(--space-1h); }
.bm-panel.hidden { display: none; }
.bm-panel-title { font-size: var(--text-sm); font-weight: 700; color: #334155; margin-bottom: var(--space-1h); }
.bm-section { margin-bottom: var(--space-2); }
.bm-section-title { font-size: var(--text-xs); font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: var(--space-0); }
.bm-card { border-radius: 8px; padding: 8px var(--radius-md); margin-bottom: 4px; font-size: var(--text-sm); line-height: 1.45; }
.bm-card-pivot { background: rgba(245,158,11,0.06); border-left: 3px solid #f59e0b; }
.bm-card-pivot-reason { color: var(--warning-deep); font-size: var(--text-xs); }
.bm-card-validated { background: rgba(16,185,129,0.06); border-left: 3px solid #10b981; }
.bm-card-discarded { background: rgba(239,68,68,0.06); border-left: 3px solid #ef4444; }
.bm-card-offer { background: rgba(59,130,246,0.06); border-left: 3px solid #3b82f6; }
.bm-card-peak { background: rgba(99,102,241,0.06); border-left: 3px solid #6366f1; }

/* History card score badge */
.history-card-score { font-size: var(--text-xs); color: #7c3aed; font-weight: 600; margin-left: var(--space-1); }

/* ============================
   Strategic Insight (Momentum 90 Exclusive)
   ============================ */
.strategic-insight {
  background: linear-gradient(135deg, rgba(234,179,8,0.08), rgba(245,158,11,0.08));
  border: 1px solid rgba(234,179,8,0.25);
  border-radius: var(--radius-md);
  padding: var(--space-2h) var(--space-3);
  margin-top: var(--space-1h);
  margin-bottom: var(--space-1h);
}
.strategic-insight-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-0);
  font-size: var(--text-xs);
  font-weight: 800;
  color: #92400e;
  background: rgba(234,179,8,0.15);
  padding: var(--space-px) var(--space-1h);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-1);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.strategic-insight-text {
  font-size: var(--text-body);
  color: #78350f;
  line-height: 1.5;
}

/* ============================
   1.5 Phase-Colored Plan Cards (audit 2026-04-09)
   ============================
   Audit: cada .plan-card.phase-FN expone --phase-color como variable CSS
   heredable. Asi todos los descendientes (.task-num, .zone-title-accent,
   etc.) pueden usar el mismo color sin necesidad de overrides por fase.
   El border-left del wrapper outer queda como senal sutil legacy para
   pantallas que NO esten dentro de una today-zone (recovery / standalone).
   Dentro de today-zone esos border-left se anulan con la regla de mas abajo. */
.plan-card.phase-F1 { --phase-color: var(--phase-F1); border-left: var(--space-0) solid var(--phase-color); }
.plan-card.phase-F2 { --phase-color: var(--phase-F2); border-left: var(--space-0) solid var(--phase-color); }
.plan-card.phase-F3 { --phase-color: var(--phase-F3); border-left: var(--space-0) solid var(--phase-color); }
.plan-card.phase-F4 { --phase-color: var(--phase-F4); border-left: var(--space-0) solid var(--phase-color); }
.plan-card.phase-F5 { --phase-color: var(--phase-F5); border-left: var(--space-0) solid var(--phase-color); }
.plan-card.phase-F6 { --phase-color: var(--phase-F6); border-left: var(--space-0) solid var(--phase-color); }
.plan-card.phase-F7 { --phase-color: var(--phase-F7); border-left: var(--space-0) solid var(--phase-color); }
.plan-card.phase-F8 { --phase-color: var(--phase-F8); border-left: var(--space-0) solid var(--phase-color); }
.plan-card.phase-F9 { --phase-color: var(--phase-F9); border-left: var(--space-0) solid var(--phase-color); }

.phase-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--text-xs-plus);
  font-weight: 700;
  padding: var(--space-0) var(--space-2);
  border-radius: var(--radius-xl);
  margin-bottom: var(--space-1h);
  color: #fff;
}
.phase-badge.phase-F1 { background: var(--phase-F1); }
.phase-badge.phase-F2 { background: var(--phase-F2); }
.phase-badge.phase-F3 { background: var(--phase-F3); }
.phase-badge.phase-F4 { background: var(--phase-F4); }
.phase-badge.phase-F5 { background: var(--phase-F5); }
.phase-badge.phase-F6 { background: var(--phase-F6); }
.phase-badge.phase-F7 { background: var(--phase-F7); }
.phase-badge.phase-F8 { background: var(--phase-F8); }
.phase-badge.phase-F9 { background: var(--phase-F9); }

/* Task checkbox (visual only) */
.task-check {
  appearance: none;
  -webkit-appearance: none;
  width: var(--space-4h);
  height: var(--space-4h);
  border: var(--space-px) solid #cbd5e1;
  border-radius: 5px;
  cursor: pointer;
  flex-shrink: 0;
  margin-right: var(--space-1h);
  transition: all 0.2s ease;
}
.task-check:checked {
  background: #10b981;
  border-color: #10b981;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.485 3.515a1.25 1.25 0 0 1 0 1.768l-6.5 6.5a1.25 1.25 0 0 1-1.768 0l-3.25-3.25a1.25 1.25 0 0 1 1.768-1.768L6.1 9.13l5.617-5.616a1.25 1.25 0 0 1 1.768 0Z'/%3E%3C/svg%3E");
  background-size: 14px;
  background-position: center;
  background-repeat: no-repeat;
}
.task-top {
  display: flex;
  align-items: flex-start;
}

/* Momentum 90 premium tier badge */
.tier-badge-momentum {
  display: inline-flex;
  align-items: center;
  gap: var(--space-0);
  font-size: var(--text-xs);
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 12px;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  color: #fff;
  letter-spacing: 0.02em;
}

@media (max-width: 480px) {
  .streak-day { width: var(--space-3); height: var(--space-3); }
  .chart-container { max-height: 180px; padding: var(--space-2); }
  .phase-celebration-content { padding: var(--space-5) var(--space-3h); }
  .achievement-glow { font-size: 3.5rem; }
}

/* ============================
   Mobile-First Hardening
   ============================ */
@media (max-width: 640px) {
  /* Plan card: reduce density */
  #planJson .plan-card {
    padding: var(--space-2h) var(--space-2);
    border-radius: 12px;
  }
  #planJson .plan-section {
    margin-top: var(--space-2);
    padding: var(--space-1h);
  }
  #planJson .sec-title {
    font-size: var(--text-sm);
  }
  #planJson .sec-body {
    font-size: var(--text-body);
  }
  #planJson .task-accion {
    font-size: var(--text-body);
  }

  /* Decision test box: prominent on mobile */
  .decision-test-box {
    padding: var(--space-2) !important;
    margin: var(--space-1h) 0 !important;
  }

  /* Mentor reasoning: compact */
  .mentor-reasoning {
    padding: var(--space-1h) var(--space-2);
  }
  .mentor-reasoning-text {
    font-size: var(--text-sm);
  }

  /* Evidence: full width fields */
  #evidenciaBox {
    padding: var(--space-2);
  }
  .evidence-metrics-row {
    flex-direction: column;
    gap: var(--space-1);
  }
  .evidence-metrics-row > div {
    width: 100%;
  }
  .evidence-metrics-row input {
    width: 100% !important;
  }
  .evidence-task-field {
    margin-bottom: var(--space-1h);
  }
  .evidence-contract-input,
  .evidence-task-input {
    width: 100%;
  }

  /* Action buttons: full width stacked */
  .botonera-dia {
    flex-direction: column;
    gap: var(--space-1);
  }
  .botonera-dia button {
    width: 100%;
    min-width: 0;
  }

  /* Help flow: stack buttons vertically */
  .quick-help-buttons {
    flex-direction: column;
  }
  .quick-help-btn--structured {
    width: 100%;
  }

  /* Recalibration diff */
  .recalibration-diff {
    font-size: var(--text-xs-plus);
    padding: var(--space-2);
  }

  /* Wizard: compact on mobile */
  .wizard-stepper {
    gap: var(--space-px);
  }
  .stepper-label {
    font-size: 0.65rem;
  }
  .wizard-actions {
    position: sticky;
    bottom: 0;
    background: rgba(255,255,255,0.95);
    padding: var(--space-2) 0;
    z-index: var(--z-float);
  }
  .wizard-textarea {
    width: 100%;
  }
  .wizard-select {
    width: 100%;
  }

  /* Collapse strategic context by default on mobile */
  #planJson details.plan-section {
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 8px;
    padding: var(--space-1) var(--space-1h);
  }
}

/* =============================================
   ENGINES V1: Economics Dashboard (M90)
   ============================================= */

/* Premium audit Apr 2026: econ panel light theme con gold accent (M90) */
/* =============================================
   P5.5: Universal Economic Intelligence Dashboard
   ============================================= */
.econ-dashboard-panel { margin-bottom: var(--space-3h); }
.econ-dash-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: var(--radius-lg);
  padding: var(--space-4);
  box-shadow: 0 4px 12px -4px rgba(11,20,48,0.08);
}
.econ-dash-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-3);
}
.econ-dash-title {
  font-weight: 700;
  font-size: var(--text-base);
  color: #1e293b;
}
.econ-dash-health {
  font-size: var(--text-sm);
  font-weight: 600;
}
.econ-dash-revenue-section {
  background: #f8fafc;
  border-radius: var(--radius-md);
  padding: var(--space-2h);
  margin-bottom: var(--space-3);
}
.econ-dash-revenue-header {
  display: flex;
  justify-content: space-between;
  font-size: var(--text-sm);
  color: #475569;
  margin-bottom: var(--space-1h);
}
.econ-dash-progress-bar {
  height: var(--space-1h);
  background: #e2e8f0;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: var(--space-1h);
}
.econ-dash-progress-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.5s ease;
}
.econ-dash-targets {
  display: flex;
  gap: var(--space-2h);
  font-size: var(--text-xs-plus);
  color: #64748b;
  flex-wrap: wrap;
}
.econ-dash-funnel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1h);
  margin-bottom: var(--space-3);
  flex-wrap: wrap;
}
.econ-dash-funnel-arrow {
  color: var(--ink-mute);
  font-size: var(--text-lg);
  font-weight: 700;
}
.econ-dash-kpi {
  text-align: center;
  min-width: 60px;
}
.econ-dash-kpi-value {
  font-size: var(--text-lg);
  font-weight: 700;
  color: #1e293b;
}
.econ-dash-kpi-label {
  font-size: var(--text-xs);
  color: var(--ink-mute);
  margin-top: var(--space-px);
}
.econ-dash-margin-row {
  display: flex;
  justify-content: center;
  gap: var(--space-4h);
  margin-bottom: var(--space-2h);
  padding: var(--space-2);
  background: #f1f5f9;
  border-radius: 8px;
}
.econ-dash-trends {
  display: flex;
  gap: var(--space-3h);
  justify-content: center;
  font-size: var(--text-xs-plus);
  font-weight: 600;
  margin-bottom: var(--space-2);
}
.econ-dash-badges {
  display: flex;
  gap: var(--space-1h);
  justify-content: center;
}
.econ-dash-badge {
  font-size: var(--text-xs);
  padding: 3px 10px;
  border-radius: 12px;
  font-weight: 600;
}
.econ-dash-badge-good {
  background: #d1fae5;
  color: #065f46;
}
.econ-dash-badge-warn {
  background: #fef3c7;
  color: #92400e;
}

.econ-panel {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 22px;
  margin-bottom: var(--space-3h);
  box-shadow: 0 8px 24px -8px rgba(11, 20, 48, 0.10),
              0 2px 6px -2px rgba(11, 20, 48, 0.06);
}
.econ-panel-premium {
  background: linear-gradient(180deg, #ffffff 0%, #fefcf6 100%);
  border-color: rgba(245, 158, 11, 0.30);
  border-top: 3px solid var(--gold);
  box-shadow: 0 14px 38px -8px rgba(245, 158, 11, 0.18),
              0 6px 16px -4px rgba(11, 20, 48, 0.08);
}
.econ-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-3h);
  gap: var(--space-2h);
}
.econ-premium-badge {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: #fff;
  background: linear-gradient(135deg, var(--gold), var(--gold-strong));
  border: 1px solid rgba(245, 158, 11, 0.45);
  padding: var(--space-0) var(--space-2h);
  border-radius: 999px;
  text-transform: uppercase;
  box-shadow: 0 4px 12px -3px rgba(245, 158, 11, 0.45);
}
.econ-value-highlight { color: var(--gold-strong) !important; }
.econ-bottleneck {
  background: rgba(220, 38, 38, 0.06);
  border: 1px solid rgba(220, 38, 38, 0.20);
  border-left: var(--space-0) solid var(--danger);
  border-radius: var(--radius-md);
  padding: var(--space-2h) var(--space-3);
  margin-bottom: var(--space-3);
}
.econ-bottleneck-label {
  font-size: 0.68rem;
  font-weight: 800;
  color: var(--danger);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--space-0);
}
.econ-bottleneck-text {
  font-size: var(--text-body);
  color: #7f1d1d;
  line-height: 1.5;
}

.econ-title {
  font-weight: 800;
  font-size: var(--text-base);
  margin: 0;
  color: var(--ink);
  letter-spacing: -0.01em;
}

.econ-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-2h);
  margin-bottom: var(--space-3);
}

.econ-metric {
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  padding: var(--space-3) var(--space-2h);
  text-align: center;
}

.econ-metric-label {
  font-size: 0.66rem;
  color: var(--ink-mute);
  margin-top: var(--space-0);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.econ-metric-value {
  font-size: 1.55rem;
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -0.02em;
}

.econ-indicators {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1h);
}

.econ-badge {
  font-size: var(--text-xs-plus);
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--surface-tint);
  border: 1px solid var(--line);
  color: var(--ink-soft);
  font-weight: 600;
}

.econ-badge-good {
  background: rgba(15, 157, 116, 0.08);
  border-color: rgba(15, 157, 116, 0.30);
  color: var(--success);
  font-weight: 700;
}

.econ-badge-warn {
  background: rgba(245, 158, 11, 0.10);
  border-color: rgba(245, 158, 11, 0.30);
  color: var(--gold-strong);
  font-weight: 700;
}

/* =============================================
   ENGINES V1: Growth Playbook (M90)
   ============================================= */

.playbook-panel {
  background: linear-gradient(135deg, rgba(99,102,241,0.08), rgba(245,158,11,0.06));
  border: 1px solid rgba(245,158,11,0.2);
  border-radius: var(--radius-lg);
  padding: var(--space-3h);
  margin-bottom: var(--space-3);
}

.playbook-title {
  font-weight: 700;
  font-size: var(--text-md);
  margin-bottom: var(--space-3);
  color: #fbbf24;
}

.playbook-section {
  margin-bottom: var(--space-2h);
}

.playbook-section-title {
  font-size: var(--text-sm);
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  margin-bottom: var(--space-1);
}

.playbook-card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: var(--space-1h) var(--space-2h);
  font-size: var(--text-sm);
  margin-bottom: var(--space-0);
  color: rgba(255,255,255,0.8);
}

.playbook-card-win {
  border-left: 3px solid #34d399;
}

.playbook-card-warn {
  border-left: 3px solid #f59e0b;
}

.playbook-replicability {
  text-align: center;
  font-size: var(--text-body);
  color: rgba(255,255,255,0.7);
  margin-top: var(--space-2);
  padding: var(--space-1h);
  background: rgba(255,255,255,0.04);
  border-radius: 8px;
}

/* =============================================
   ENGINES V1: Policy Badges
   ============================================= */

.policy-badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  padding: var(--space-2) var(--space-3);
  background: rgba(30,41,59,0.5);
  border-radius: 8px;
  margin: var(--space-1) 0 var(--space-2);
}

.policy-badges-label {
  width: 100%;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--ink-mute);
  margin-bottom: var(--space-px);
  font-weight: 600;
}

.policy-badge {
  display: inline-block;
  font-size: var(--text-xs);
  padding: 3px 10px;
  border-radius: var(--radius-xl);
  font-weight: 600;
}

.policy-forbidden {
  background: rgba(239,68,68,0.15);
  border: 1px solid rgba(239,68,68,0.3);
  color: #fca5a5;
}

.policy-required {
  background: rgba(16,185,129,0.15);
  border: 1px solid rgba(16,185,129,0.3);
  color: #6ee7b7;
}

.policy-critical {
  background: rgba(245,158,11,0.2);
  border: 1px solid rgba(245,158,11,0.4);
  color: #fcd34d;
}

.policy-info {
  background: rgba(59,130,246,0.15);
  border: 1px solid rgba(59,130,246,0.3);
  color: #93c5fd;
}

/* =============================================
   Gate Progress Card
   ============================================= */

.gate-progress-card {
  background: rgba(30,41,59,0.6);
  border: 1px solid rgba(99,102,241,0.25);
  border-radius: 12px;
  padding: var(--space-3) var(--space-3h);
  margin-top: var(--space-2h);
}

.gate-progress-header {
  display: flex;
  align-items: center;
  gap: var(--space-1h);
  font-size: var(--text-body);
  color: #e2e8f0;
  margin-bottom: var(--space-2);
}

.gate-progress-icon { font-size: var(--text-lg); }

.gate-progress-bar-track {
  height: var(--space-1h);
  background: rgba(255,255,255,0.08);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: var(--space-0);
}

.gate-progress-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #6366f1, #8b5cf6);
  border-radius: 4px;
  transition: width 0.6s ease;
}

.gate-progress-pct {
  font-size: var(--text-xs-plus);
  color: #a5b4fc;
  text-align: right;
  margin-bottom: var(--space-1h);
  font-weight: 600;
}

.gate-reqs {
  display: flex;
  flex-direction: column;
  gap: var(--space-0);
}

.gate-req {
  font-size: var(--text-sm);
  /* B12 (audit 2026-06-02): #b4bfcf quedaba borderline sobre el fondo atenuado
     del gate-progress-card. #cbd5e1 sube el contraste a AA cómodo. */
  color: #cbd5e1;
  padding: var(--space-px) 0;
}

.gate-progress-title {
  font-size: var(--text-body);
  color: #e2e8f0;
}

.gate-req-done {
  color: #6ee7b7;
  text-decoration: line-through;
  /* B12: 0.7 hundía el verde sobre el fondo oscuro. 0.9 lo mantiene legible. */
  opacity: 0.9;
}

/* Missing CSS classes (inline-styled in JS but need class definitions) */
.diag-card { border-radius: var(--radius-md); padding: 12px var(--radius-lg); }
.diag-pattern { font-size: var(--text-sm); }
.evidence-contract-header { font-size: var(--text-sm); color: #059669; font-weight: 600; margin-bottom: var(--space-1h); text-transform: uppercase; letter-spacing: 0.03em; }
.ctx-prompt-body { padding: var(--space-2); }
.weekly-review-interactive { margin-top: 12px; padding: 12px; border-radius: var(--radius-md); border-left: 3px solid #6366f1; }

/* =============================================
   ENGINES V1: Phase Triple Indicator
   ============================================= */

.phase-triple-indicator {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  font-size: var(--text-xs);
  padding: 3px 10px;
  border-radius: var(--radius-xl);
  background: rgba(245,158,11,0.1);
  border: 1px solid rgba(245,158,11,0.25);
  color: rgba(255,255,255,0.75);
  margin-left: var(--space-1h);
}

.phase-triple-cal { opacity: 0.6; }
.phase-triple-sep { opacity: 0.3; }
.phase-triple-op { font-weight: 700; color: #fbbf24; }

/* =============================================
   ENGINES V1: Experiment Frame
   ============================================= */

.experiment-criteria {
  font-size: var(--text-xs-plus);
  color: rgba(255,255,255,0.6);
  margin-top: var(--space-1);
  padding: var(--space-0) var(--space-1h);
  background: rgba(255,255,255,0.04);
  border-radius: var(--radius-sm);
  border-left: var(--space-px) solid rgba(59,130,246,0.3);
}

/* =============================================
   ENGINES V1: Chat UI
   ============================================= */

.chat-container {
  width: min(680px, 100%);
  margin: 0 auto;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.chat-messages {
  max-height: 55vh;
  overflow-y: auto;
  padding: var(--space-3h);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.chat-bubble {
  max-width: 85%;
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-lg);
  font-size: var(--text-body);
  line-height: 1.5;
  word-wrap: break-word;
}

.chat-user {
  align-self: flex-end;
  background: var(--accent, #2563eb);
  color: #fff;
  border-bottom-right-radius: var(--space-0);
}

.chat-ai, .chat-ai-wizard, .chat-ai-evidence {
  align-self: flex-start;
  background: rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.92);
  border-bottom-left-radius: var(--space-0);
}

.chat-ai-wizard {
  border-left: 3px solid #60a5fa;
}

.chat-ai-evidence {
  border-left: 3px solid #34d399;
}

.chat-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  padding: 0 16px;
}

.chat-chip {
  display: inline-block;
  background: rgba(59,130,246,0.2);
  border: 1px solid rgba(59,130,246,0.4);
  color: #93c5fd;
  font-size: var(--text-xs-plus);
  padding: 3px 10px;
  border-radius: var(--radius-xl);
}

.chat-typing {
  display: flex;
  gap: 5px;
  padding: var(--space-1h) var(--space-3h);
  align-self: flex-start;
}

.chat-typing span {
  width: var(--space-1h);
  height: var(--space-1h);
  background: rgba(255,255,255,0.4);
  border-radius: 50%;
  animation: chatTyping 1.2s infinite;
}

.chat-typing span:nth-child(2) { animation-delay: 0.2s; }
.chat-typing span:nth-child(3) { animation-delay: 0.4s; }

@keyframes chatTyping {
  0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); }
  40% { opacity: 1; transform: scale(1.1); }
}

.chat-typing.hidden { display: none; }

.chat-progress {
  height: var(--space-0);
  background: rgba(255,255,255,0.1);
  margin: 0 16px;
  border-radius: 2px;
  overflow: hidden;
}

.chat-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #34d399, #60a5fa);
  border-radius: 2px;
  transition: width 0.4s ease;
}

.chat-input-row {
  display: flex;
  gap: var(--space-1h);
  padding: var(--space-2h) var(--space-3h);
  border-top: 1px solid rgba(255,255,255,0.08);
}

.chat-input {
  flex: 1;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: var(--radius-md);
  padding: var(--space-1h) var(--space-2h);
  color: #fff;
  font-size: var(--text-body);
  resize: none;
  font-family: inherit;
}

.chat-input::placeholder {
  color: rgba(255,255,255,0.4);
}

.chat-send {
  background: var(--accent, #2563eb);
  color: #fff;
  border: none;
  border-radius: var(--radius-md);
  padding: var(--space-1h) var(--space-4);
  font-size: var(--text-body);
  cursor: pointer;
  font-weight: 600;
  transition: opacity 0.2s;
}

.chat-send:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.chat-send:hover:not(:disabled) {
  opacity: 0.85;
}

/* ── Tema claro del ChatEngine (2026-06-12) ──────────────────────────
 * El chat base asume fondo OSCURO (texto/fondos blancos translúcidos).
 * Montado en el dashboard (container blanco) quedaba blanco-sobre-blanco:
 * burbuja del mentor y textarea invisibles (bug founder, evidence chat).
 * Todo host sobre superficie clara monta con ChatEngine({theme:"light"}). */
.chat-container.chat-light {
  background: #f8fafc;
  border-color: rgba(15, 23, 42, 0.10);
}
.chat-light .chat-ai, .chat-light .chat-ai-wizard, .chat-light .chat-ai-evidence {
  background: #eef2f7;
  color: #1e293b;
}
.chat-light .chat-input-row {
  border-top-color: rgba(15, 23, 42, 0.08);
}
.chat-light .chat-input {
  background: #ffffff;
  border-color: #cbd5e1;
  color: #0f172a;
}
.chat-light .chat-input::placeholder {
  color: #94a3b8;
}
.chat-light .chat-typing span {
  background: rgba(15, 23, 42, 0.35);
}
.chat-light .chat-progress {
  background: rgba(15, 23, 42, 0.08);
}
.chat-light .chat-chip {
  background: rgba(37, 99, 235, 0.08);
  border-color: rgba(37, 99, 235, 0.3);
  color: #1d4ed8;
}

/* Encabezado explicativo del chat (2026-06-12): da contexto de qué es esta
 * conversación. Sin esto el chat aparece "de la nada" (feedback founder). */
.chat-intro {
  padding: var(--space-3) var(--space-3h) var(--space-2h);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.chat-intro-title {
  font-size: var(--text-body);
  font-weight: 700;
  color: rgba(255, 255, 255, 0.95);
  margin-bottom: var(--space-1);
}
.chat-intro-subtitle {
  font-size: var(--text-xs-plus);
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.6);
}
.chat-light .chat-intro {
  border-bottom-color: rgba(15, 23, 42, 0.08);
}
.chat-light .chat-intro-title {
  color: #0f172a;
}
.chat-light .chat-intro-subtitle {
  color: #64748b;
}

.chat-action {
  padding: var(--space-2h) var(--space-3h);
  text-align: center;
}

.chat-action.hidden { display: none; }

.chat-action-btn {
  background: linear-gradient(135deg, #34d399, #2563eb);
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: var(--space-2h) var(--space-6);
  font-size: var(--text-base);
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}

.chat-action-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(37,99,235,0.3);
}

/* Decide mode cards */
.decide-card {
  padding: var(--space-0) 0;
}

.decide-diagnosis {
  font-size: var(--text-base);
  color: rgba(255,255,255,0.9);
  margin-bottom: var(--space-3);
  padding: var(--space-2) var(--space-3);
  background: rgba(255,255,255,0.06);
  border-radius: var(--radius-md);
  border-left: 3px solid #f59e0b;
}

.decide-options {
  display: flex;
  gap: var(--space-2h);
  margin-bottom: var(--space-3);
}

.decide-option {
  flex: 1;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 12px;
  padding: var(--space-3);
}

.decide-option-name {
  font-weight: 700;
  font-size: var(--text-body);
  color: #93c5fd;
  margin-bottom: var(--space-1);
}

.decide-option-desc {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.7);
  margin-bottom: var(--space-1h);
}

.decide-pros, .decide-cons {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-bottom: var(--space-0);
}

.decide-pro {
  font-size: var(--text-xs-plus);
  color: #34d399;
}

.decide-con {
  font-size: var(--text-xs-plus);
  color: #f87171;
}

.decide-reco {
  font-size: var(--text-body);
  color: rgba(255,255,255,0.85);
  padding: var(--space-2) var(--space-3);
  background: rgba(37,99,235,0.1);
  border-radius: var(--radius-md);
  border-left: 3px solid #2563eb;
}

/* Mobile chat adjustments */
@media (max-width: 640px) {
  .chat-messages {
    max-height: 45vh;
  }
  .chat-bubble {
    max-width: 92%;
    font-size: var(--text-sm);
  }
  .decide-options {
    flex-direction: column;
  }
}

/* ═══════════════════════════════════════════
   SYSTEM DECISION BLOCK — Movement 1
   The system's intelligence made visible
   ═══════════════════════════════════════════ */

.system-decision-block {
  background: linear-gradient(135deg, rgba(30,58,138,0.08) 0%, rgba(99,102,241,0.06) 100%);
  border: 1px solid rgba(99,102,241,0.2);
  border-left: var(--space-0) solid #6366f1;
  border-radius: 12px;
  padding: var(--space-3h) var(--space-4);
  margin-bottom: var(--space-3h);
}

/* Yesterday's result chain — already styled, enhance within block */
.system-decision-block .decision-chain-box {
  background: rgba(0,0,0,0.05);
  border-radius: 8px;
  padding: var(--space-2) var(--space-2h);
  margin-bottom: var(--space-2h);
  font-size: var(--text-body);
  border: none;
}

/* System's reading — mentor reasoning elevated */
.system-reading {
  margin-bottom: var(--space-2h);
}
.system-reading-text {
  font-size: var(--text-base);
  line-height: 1.55;
  color: #3730a3;
  font-style: italic;
  white-space: pre-wrap;
}

/* Today's experiment — the central hypothesis being tested */
.system-hypothesis {
  background: rgba(99,102,241,0.12);
  border: 1px solid rgba(99,102,241,0.25);
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-3h);
}
.system-hypothesis-label {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #4338ca;
  font-weight: 700;
  margin-bottom: var(--space-1);
}
.system-hypothesis-question {
  font-size: var(--text-lg);
  font-weight: 700;
  color: #312e81;
  line-height: 1.45;
}

/* Consequence — what happens based on the answer */
.system-consequence {
  margin-top: var(--space-2);
  padding-top: var(--space-2);
  border-top: 1px solid rgba(99,102,241,0.2);
  font-size: var(--text-body);
  color: #4338ca;
}
.consequence-label {
  display: inline-block;
  background: rgba(99,102,241,0.15);
  color: #3730a3;
  font-weight: 600;
  font-size: var(--text-xs-plus);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: var(--space-px) var(--space-1h);
  border-radius: 4px;
  margin-right: var(--space-1h);
}
.consequence-text {
  color: #3730a3;
}

/* Phase goal as secondary element */
.plan-goal-secondary {
  font-size: var(--text-sm);
  color: #64748b;
  font-weight: 500;
  margin-bottom: var(--space-2h);
  padding: 0 2px;
}

/* M90 enhanced decision block */
.tier-momentum .system-decision-block {
  border-left-color: #a78bfa;
  background: linear-gradient(135deg, rgba(79,70,229,0.10) 0%, rgba(167,139,250,0.06) 100%);
}
.tier-momentum .system-hypothesis {
  background: rgba(167,139,250,0.12);
  border-color: rgba(167,139,250,0.25);
}
.tier-momentum .system-hypothesis-question {
  color: #4c1d95;
}

@media (max-width: 480px) {
  .system-decision-block {
    padding: var(--space-2h) var(--space-3);
  }
  .system-hypothesis-question {
    font-size: var(--text-md);
  }
}

/* ═══════════════════════════════════════════════════════════════════
   PREMIUM PASS — Tokens + Component overrides
   Fix visual de "se ve normal, nada premium". Aplica una capa coherente
   de gradientes indigo-gold, sombras elevadas, tipografía editorial y
   microanimaciones a TODO el flujo (no solo Día 1).
   ═══════════════════════════════════════════════════════════════════ */

:root {
  --grad-premium-dark: linear-gradient(135deg, #0f0a2e 0%, #1e1b4b 40%, #312e81 100%);
  --grad-premium-dark-soft: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);
  --grad-premium-gold: linear-gradient(135deg, #fbbf24, #d97706);
  --grad-premium-action: linear-gradient(135deg, #6366f1, #8b5cf6);
  --grad-premium-success: linear-gradient(135deg, #10b981, #059669);
  --grad-premium-danger: linear-gradient(135deg, #ef4444, #b91c1c);
  --shadow-premium-lg: 0 18px 50px rgba(15,10,46,0.22), 0 4px 14px rgba(15,10,46,0.10);
  --shadow-premium-md: 0 8px 24px rgba(99,102,241,0.16), 0 2px 6px rgba(15,10,46,0.06);
  --shadow-premium-sm: 0 4px 14px rgba(99,102,241,0.10);
  --shadow-premium-glow: 0 0 0 1px rgba(167,139,250,0.18), 0 8px 28px rgba(99,102,241,0.18);
  --border-premium: 1px solid rgba(167,139,250,0.22);
  --border-premium-gold: 1px solid rgba(251,191,36,0.32);
  --ink-premium: #0f0a2e;
  --ink-premium-soft: #4c1d95;
  --mono-premium: 'SF Mono', 'Fira Code', 'JetBrains Mono', 'Consolas', monospace;
}

@keyframes premiumFadeUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes premiumShimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
@keyframes premiumPulseGold {
  0%, 100% { box-shadow: 0 0 0 0 rgba(251,191,36,0.5); }
  50%      { box-shadow: 0 0 0 8px rgba(251,191,36,0); }
}
@keyframes premiumPulseDanger {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,0.4); }
  50%      { box-shadow: 0 0 0 6px rgba(239,68,68,0); }
}

/* ─── Day 1 Welcome overlay tipografía premium ─────────────────── */
.d1w-card {
  max-width: 480px !important;
}
.d1w-greeting {
  font-size: var(--text-xs-plus) !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  color: #c7d2fe !important;
  margin-bottom: var(--space-1h) !important;
}
.d1w-title {
  font-size: 1.85rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
  background: linear-gradient(135deg, #ffffff 0%, #c7d2fe 60%, #fbbf24 120%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: var(--space-5) !important;
}
.d1w-cta {
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: var(--text-body) !important;
  padding: var(--space-3h) 44px !important;
  border-radius: var(--radius-lg) !important;
}
.d1w-cta::after {
  content: " →";
  font-weight: 800;
}

/* ─── Day 1 Premium Wrapper rediseño ─────────────────────────────── */
.day1-premium-wrapper {
  background: var(--grad-premium-dark) !important;
  border-radius: 22px !important;
  padding: 0 !important;
  box-shadow: var(--shadow-premium-lg) !important;
  border: var(--border-premium) !important;
  overflow: hidden;
  margin-bottom: var(--space-4);
  animation: premiumFadeUp 0.6s ease;
}
.day1-premium-wrapper .plan-card {
  background: #ffffff !important;
  margin: 0 !important;
  border-radius: 0 0 22px 22px !important;
  border: none !important;
  box-shadow: none !important;
}
.day1-header {
  text-align: center !important;
  padding: 28px 22px 22px !important;
  background: transparent !important;
  position: relative;
}
.day1-header::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(251,191,36,0.10) 50%, transparent 100%);
  background-size: 200% 100%;
  animation: premiumShimmer 6s linear infinite;
  pointer-events: none;
}
.day1-badge {
  background: var(--grad-premium-gold) !important;
  color: #1e1b4b !important;
  font-weight: 900 !important;
  font-size: var(--text-xs) !important;
  padding: var(--space-1) var(--space-4) !important;
  border-radius: 999px !important;
  letter-spacing: 0.18em !important;
  margin-bottom: var(--space-2h) !important;
  box-shadow: 0 4px 14px rgba(251,191,36,0.35);
  position: relative;
  z-index: var(--z-local);
}
.day1-title {
  font-size: 1.7rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: var(--space-1) !important;
  color: #ffffff !important;
  position: relative;
  z-index: var(--z-local);
}
.day1-subtitle {
  font-size: var(--text-base) !important;
  color: #c7d2fe !important;
  font-weight: 500 !important;
  position: relative;
  z-index: var(--z-local);
}

/* ─── Day 1 secciones (diagnostico/case/roadmap) — editorial ─── */
.day1-section {
  margin: var(--space-3) 0 !important;
  padding: var(--space-4) var(--space-4h) !important;
  border-radius: var(--radius-lg) !important;
  background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%) !important;
  border: 1px solid rgba(99,102,241,0.10) !important;
  box-shadow: var(--shadow-premium-sm) !important;
  position: relative;
  overflow: hidden;
  animation: premiumFadeUp 0.5s ease;
}
.day1-section::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: var(--space-0);
  border-radius: var(--radius-lg) 0 0 var(--radius-lg);
}
.day1-diagnostic { background: linear-gradient(135deg, rgba(99,102,241,0.04), #ffffff) !important; }
.day1-diagnostic::before { background: var(--grad-premium-action); }
.day1-case { background: linear-gradient(135deg, rgba(16,185,129,0.05), #ffffff) !important; }
.day1-case::before { background: var(--grad-premium-success); }
.day1-roadmap { background: linear-gradient(135deg, rgba(251,191,36,0.06), #ffffff) !important; }
.day1-roadmap::before { background: var(--grad-premium-gold); }

.day1-section-title {
  font-weight: 800 !important;
  font-size: var(--text-xs) !important;
  color: #4c1d95 !important;
  margin-bottom: var(--space-2) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.14em !important;
  display: flex;
  align-items: center;
  gap: var(--space-1h);
}
.day1-section-title::before {
  content: "◆";
  color: #fbbf24;
  font-size: 0.85em;
}
.day1-section-body {
  font-size: var(--text-base) !important;
  color: #1e293b !important;
  line-height: 1.65 !important;
  font-weight: 400;
  white-space: pre-line;
}
.day1-roadmap-item {
  font-size: var(--text-base) !important;
  color: #1e293b !important;
  padding: var(--space-1) 0;
  border-bottom: 1px dashed rgba(99,102,241,0.12);
}
.day1-roadmap-item:last-child { border-bottom: none; }
.day1-revenue-target {
  color: #d97706 !important;
  font-weight: 800 !important;
  font-family: var(--mono-premium);
  font-size: 0.95em;
}

/* ─── REVENUE MONEY TRACKER CARD (la pieza estrella) ─────────────── */
.revenue-bar-container {
  margin: var(--space-3h) 0 !important;
  padding: 0 !important;
  background: var(--grad-premium-dark) !important;
  border-radius: 18px !important;
  border: var(--border-premium-gold) !important;
  box-shadow: var(--shadow-premium-lg) !important;
  overflow: hidden;
  position: relative;
  animation: premiumFadeUp 0.5s ease;
}
.revenue-bar-container::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 0%, rgba(251,191,36,0.06) 50%, transparent 100%);
  background-size: 200% 100%;
  animation: premiumShimmer 5s linear infinite;
  pointer-events: none;
}
.revenue-bar-label {
  display: none !important;
}
.revenue-bar-track {
  display: none !important;
}
.revenue-bar-hint {
  display: none !important;
}

/* Premium money tracker (rendered by JS via .money-tracker classes) */
.money-tracker {
  position: relative;
  z-index: var(--z-local);
  padding: var(--space-4h) 22px;
  color: #ffffff;
}
.money-tracker-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-3h);
  margin-bottom: var(--space-3);
}
.money-tracker-label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #fbbf24;
  margin-bottom: var(--space-0);
}
.money-tracker-amount {
  font-family: var(--mono-premium);
  font-size: 2rem;
  font-weight: 800;
  background: linear-gradient(135deg, #fbbf24 0%, #fde68a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -0.02em;
  line-height: 1;
}
.money-tracker-status {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2h);
  border-radius: 999px;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  white-space: nowrap;
  height: fit-content;
}
.money-tracker-status.on-track {
  background: rgba(16,185,129,0.18);
  color: #6ee7b7;
  border: 1px solid rgba(16,185,129,0.4);
}
.money-tracker-status.ahead {
  background: rgba(251,191,36,0.18);
  color: #fde68a;
  border: 1px solid rgba(251,191,36,0.4);
  animation: premiumPulseGold 2s ease-in-out infinite;
}
.money-tracker-status.behind {
  background: rgba(239,68,68,0.18);
  color: #fca5a5;
  border: 1px solid rgba(239,68,68,0.4);
  animation: premiumPulseDanger 2s ease-in-out infinite;
}
.money-tracker-status.start {
  background: rgba(167,139,250,0.18);
  color: #c4b5fd;
  border: 1px solid rgba(167,139,250,0.4);
}
.money-tracker-bar {
  position: relative;
  height: var(--space-3);
  background: rgba(255,255,255,0.08);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: var(--space-3);
  border: 1px solid rgba(255,255,255,0.06);
}
.money-tracker-fill {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, #6366f1 0%, #8b5cf6 50%, #fbbf24 100%);
  background-size: 200% 100%;
  animation: premiumShimmer 3s linear infinite;
  border-radius: 999px;
  transition: width 0.8s cubic-bezier(.2,.8,.2,1);
  box-shadow: 0 0 12px rgba(139,92,246,0.5);
}
.money-tracker-fill.behind {
  background: linear-gradient(90deg, #ef4444 0%, #f59e0b 100%);
}
.money-tracker-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-2);
  padding-top: var(--space-2h);
  border-top: 1px solid rgba(167,139,250,0.18);
}
.money-tracker-stat {
  text-align: center;
}
.money-tracker-stat-label {
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-mute);
  margin-bottom: var(--space-0);
}
.money-tracker-stat-value {
  font-family: var(--mono-premium);
  font-size: var(--text-base);
  font-weight: 800;
  color: #e0e7ff;
}
.money-tracker-stat-value.gold { color: #fbbf24; }
.money-tracker-stat-value.danger { color: #fca5a5; }

/* ─── Task tiers como cards diferenciadas ───────────────────────── */
.task-tier {
  border-left: none !important;
  padding: 0 !important;
  margin: var(--space-3h) 0 !important;
  border-radius: var(--radius-lg) !important;
  background: #ffffff !important;
  box-shadow: var(--shadow-premium-sm) !important;
  border: 1px solid rgba(15,23,42,0.06) !important;
  overflow: hidden;
  animation: premiumFadeUp 0.5s ease;
}
.task-tier .sec-title {
  display: flex !important;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2h) var(--space-4) !important;
  margin: 0 !important;
  font-size: var(--text-xs) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.14em !important;
  border-bottom: 1px solid rgba(15,23,42,0.06);
}
.task-tier .sec-title::before {
  content: "";
  display: inline-block;
  width: var(--space-2);
  height: var(--space-2);
  border-radius: 50%;
}
.task-tier ul.tasks {
  padding: var(--space-3) var(--space-4) !important;
  margin: 0 !important;
}
.task-tier-priority {
  background: linear-gradient(135deg, rgba(239,68,68,0.05) 0%, #ffffff 60%) !important;
  border-left: var(--space-0) solid #ef4444 !important;
}
.task-tier-priority .sec-title {
  color: #b91c1c !important;
  background: rgba(239,68,68,0.06);
}
.task-tier-priority .sec-title::before { background: #ef4444; box-shadow: 0 0 8px rgba(239,68,68,0.5); }

.task-tier-extended {
  background: linear-gradient(135deg, rgba(245,158,11,0.05) 0%, #ffffff 60%) !important;
  border-left: var(--space-0) solid #f59e0b !important;
  margin-top: var(--space-3) !important;
}
.task-tier-extended .sec-title {
  color: #b45309 !important;
  background: rgba(245,158,11,0.06);
}
.task-tier-extended .sec-title::before { background: #f59e0b; box-shadow: 0 0 8px rgba(245,158,11,0.5); }

.task-tier-overachiever {
  background: linear-gradient(135deg, rgba(16,185,129,0.05) 0%, #ffffff 60%) !important;
  border-left: var(--space-0) solid #10b981 !important;
  margin-top: var(--space-3) !important;
}
.task-tier-overachiever .task-tier-toggle {
  padding: var(--space-3) var(--space-4) !important;
  font-weight: 800 !important;
  font-size: var(--text-xs) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.14em !important;
  color: #047857 !important;
  background: rgba(16,185,129,0.06);
  border-bottom: 1px solid rgba(16,185,129,0.15);
  display: flex !important;
  align-items: center;
  gap: var(--space-2);
}
.task-tier-overachiever .task-tier-toggle::before {
  content: "";
  display: inline-block;
  width: var(--space-2);
  height: var(--space-2);
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 8px rgba(16,185,129,0.5);
}
.task-tier-overachiever.collapsed .plan-tier-body { display: none; }
.task-tier-overachiever .plan-tier-body { padding: var(--space-3) var(--space-4); }
.task-tier-overachiever .toggle-icon { margin-left: auto; transition: transform 0.3s; }
.task-tier-overachiever.collapsed .toggle-icon { transform: rotate(-90deg); }

.task-tier-counter {
  margin-left: auto;
  font-size: 0.65rem;
  font-weight: 700;
  color: #64748b;
  letter-spacing: 0.08em;
  text-transform: none;
}

.task-tier .tasks li {
  animation: premiumFadeUp 0.4s ease backwards;
}
.task-tier .tasks li:nth-child(1) { animation-delay: 0.05s; }
.task-tier .tasks li:nth-child(2) { animation-delay: 0.10s; }
.task-tier .tasks li:nth-child(3) { animation-delay: 0.15s; }
.task-tier .tasks li:nth-child(4) { animation-delay: 0.20s; }
.task-tier .tasks li:nth-child(5) { animation-delay: 0.25s; }

/* ─── Task "porque" — mejorada ──────────────────────────────────── */
.task-porque {
  font-size: var(--text-sm) !important;
  color: #4c1d95 !important;
  margin: var(--space-1) 0 var(--space-2) var(--space-5) !important;
  padding: var(--space-1h) var(--space-2h);
  background: linear-gradient(90deg, rgba(99,102,241,0.06), transparent);
  border-left: var(--space-px) solid #818cf8;
  border-radius: 0 6px 6px 0;
  line-height: 1.5 !important;
}
.task-porque::before {
  content: "Por qué importa: ";
  font-weight: 800;
  color: #6366f1;
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  display: inline;
}
.task-porque em { font-style: normal; }

/* ─── Script Cards "regalo" copy-paste ──────────────────────────── */
.task-script {
  margin: var(--space-1h) 0 var(--space-2h) var(--space-5) !important;
  background: var(--grad-premium-dark) !important;
  border-radius: 12px !important;
  border: 1px dashed rgba(251,191,36,0.35) !important;
  box-shadow: var(--shadow-premium-md);
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
}
.task-script:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-premium-glow);
}
.task-script-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-2) var(--space-3);
  background: rgba(0,0,0,0.18);
  border-bottom: 1px solid rgba(251,191,36,0.18);
}
.task-script-label {
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  color: #fbbf24 !important;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin: 0 !important;
  display: flex;
  align-items: center;
  gap: var(--space-1);
}
.task-script-label::before { content: "◆"; }
.task-script-copy-btn {
  background: var(--grad-premium-gold);
  color: #1e1b4b;
  border: none;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
  box-shadow: 0 2px 8px rgba(251,191,36,0.3);
}
.task-script-copy-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(251,191,36,0.45);
}
.task-script-copy-btn.copied {
  background: var(--grad-premium-success);
  color: #ffffff;
}
.task-script-text {
  margin: 0 !important;
  padding: var(--space-3) var(--space-3h) !important;
  background: transparent !important;
  border: none !important;
  font-family: var(--mono-premium) !important;
  font-size: var(--text-sm) !important;
  color: #e0e7ff !important;
  line-height: 1.6 !important;
  white-space: pre-wrap !important;
  word-break: break-word;
}

/* ─── Progressive Question modal — premium overlay ──────────────── */
.pq-overlay {
  background: rgba(15,10,46,0.78) !important;
  backdrop-filter: blur(10px) !important;
}
.pq-card {
  background: var(--grad-premium-dark) !important;
  border-radius: 22px !important;
  padding: 0 !important;
  max-width: 460px !important;
  width: 92% !important;
  box-shadow: var(--shadow-premium-lg) !important;
  border: var(--border-premium) !important;
  overflow: hidden;
  animation: premiumFadeUp 0.4s ease;
}
.pq-card::before {
  content: "";
  display: block;
  height: var(--space-0);
  background: var(--grad-premium-gold);
}
.pq-header {
  padding: var(--space-5) 26px var(--space-1h);
  text-align: left;
}
.pq-day-badge {
  display: inline-block;
  background: var(--grad-premium-gold);
  color: #1e1b4b;
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 5px 14px;
  border-radius: 999px;
  margin-bottom: var(--space-2h);
}
.pq-title {
  font-size: var(--text-lg);
  font-weight: 800;
  color: #ffffff;
  line-height: 1.35;
  margin-bottom: var(--space-1);
}
.pq-hint {
  font-size: var(--text-xs-plus);
  color: #c7d2fe;
  margin-bottom: 0;
}
.pq-body {
  padding: var(--space-3h) 26px 22px;
}
.pq-label {
  display: none !important;
}
.pq-input {
  width: 100% !important;
  background: rgba(255,255,255,0.06) !important;
  border: 1.5px solid rgba(167,139,250,0.25) !important;
  border-radius: 12px !important;
  padding: var(--space-3) var(--space-3h) !important;
  font-size: var(--text-md) !important;
  color: #ffffff !important;
  margin-bottom: var(--space-3h) !important;
  font-family: inherit;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.pq-input::placeholder { color: rgba(199,210,254,0.5); font-style: italic; }
.pq-input:focus {
  border-color: #fbbf24 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(251,191,36,0.18) !important;
}
.pq-input option { background: #1e1b4b; color: #fff; }
.pq-actions {
  display: flex !important;
  gap: var(--space-2) !important;
  flex-direction: column;
}
.pq-actions .btn-primario {
  background: var(--grad-premium-action) !important;
  color: #ffffff !important;
  border: none !important;
  padding: var(--space-3) var(--space-5) !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  font-size: var(--text-base) !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: var(--shadow-premium-md) !important;
  transition: transform 0.2s, box-shadow 0.2s;
  width: 100%;
}
.pq-actions .btn-primario:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(99,102,241,0.4) !important;
}
.pq-actions .btn-secundario {
  background: transparent !important;
  color: #c7d2fe !important;
  border: 1px solid rgba(167,139,250,0.25) !important;
  padding: var(--space-2) var(--space-4) !important;
  border-radius: 12px !important;
  font-size: var(--text-xs-plus) !important;
  font-weight: 600 !important;
  cursor: pointer;
  width: 100%;
}
.pq-actions .btn-secundario:hover {
  background: rgba(167,139,250,0.08) !important;
}

/* ─── Wizard Quick — premium pass ─────────────────────────────────── */
/* Audit 2026-04-09: cuando el wizard-quick vive dentro de .auth-card-body
 * (flujo post-pago), el padding del body y el border-radius del wizard
 * crean 3 capas de cajas anidadas con esquinas que se "cortan" entre si.
 * Fix: el auth-card-body pierde padding, el wizard llena todo el espacio,
 * y la auth-card (overflow:hidden, border-radius:var(--radius-xl)) hace el corte limpio.
 * El background del auth-card se vuelve oscuro para que no se vea un borde
 * blanco entre el wizard oscuro y las esquinas redondeadas. */
/* :has() para navegadores modernos + clase JS para fallback */
.auth-card-body:has(.wizard-quick),
.auth-card--wizard-active .auth-card-body {
  padding: 0 !important;
}
.auth-card:has(.wizard-quick),
.auth-card--wizard-active {
  background: var(--bg-base) !important;
  border-color: rgba(167, 139, 250, 0.15) !important;
}
.wizard-quick {
  padding: var(--space-6) 28px !important;
  background: var(--grad-premium-dark);
  border-radius: 0;
  color: #ffffff;
  box-shadow: none;
  border: none;
  position: relative;
  overflow: hidden;
}
.wizard-quick::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: var(--space-0);
  background: var(--grad-premium-gold);
}
.wizard-quick-title {
  font-size: 1.7rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
  color: #ffffff !important;
  margin-bottom: var(--space-1) !important;
  background: linear-gradient(135deg, #ffffff 0%, #fbbf24 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.wizard-quick-subtitle {
  font-size: var(--text-base) !important;
  color: #c7d2fe !important;
  margin-bottom: var(--space-5) !important;
  line-height: 1.5 !important;
}
.wizard-quick-label {
  font-size: var(--text-xs-plus) !important;
  font-weight: 800 !important;
  color: #fbbf24 !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin: 22px 0 8px !important;
  display: flex;
  align-items: center;
  gap: var(--space-1h);
}
/* Numeración por CSS counter (2026-06-12): antes solo nth-of-type(1..3)
   tenían número y el resto mostraba el círculo dorado VACÍO (bug founder:
   "las primeras tienen número y las de abajo no"). El counter numera TODAS
   las preguntas visibles en orden; los wrappers ocultos (display:none, ej.
   #wqCanalWrap/#wqEconWrap) no generan caja → no incrementan → numeración
   contigua. Los sub-campos del bloque económico llevan --sub (sin número:
   son detalles de una misma pregunta, no preguntas nuevas). */
.wizard-quick { counter-reset: wq-question; }
.wizard-quick-label::before {
  counter-increment: wq-question;
  content: counter(wq-question);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--grad-premium-gold);
  color: #1e1b4b;
  font-size: var(--text-xs);
  font-weight: 900;
  flex-shrink: 0;
}
.wizard-quick-label--sub::before {
  content: none;
  counter-increment: none;
}
/* Contexto del cuello en el paso 2 del wizard aplicar (2026-06-12): conecta
   el select del paso 1 con el texto libre — profundización, no repetición. */
.wizard-cuello-context {
  font-size: var(--text-sm);
  color: #1e3a6e;
  background: #eef2ff;
  border-left: 3px solid #6366f1;
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
  margin-bottom: var(--space-3);
  overflow-wrap: break-word;
}

/* Hint debajo del input (2026-06-12): el margen superior NEGATIVO previo
   (-10px) asumía un margin-bottom en el input, pero .wizard-quick-input
   tiene margin-bottom 0 → el hint se metía 10px DENTRO del marco y el
   borde inferior del input cruzaba el texto (bug founder: "el ejemplo
   queda fuera del marco"). Margen positivo: hint pegado pero FUERA. */
.wizard-quick-hint {
  font-size: 0.78rem;
  margin: 6px 0 12px 2px;
  color: rgba(199, 210, 254, 0.72);
  line-height: 1.4;
  overflow-wrap: break-word;
  word-break: break-word;
  max-width: 100%;
}
.wizard-quick-input {
  background: rgba(255,255,255,0.06) !important;
  border: 1.5px solid rgba(167,139,250,0.25) !important;
  color: #ffffff !important;
  padding: var(--space-3) var(--space-3h) !important;
  font-size: var(--text-base) !important;
  border-radius: 12px !important;
  font-family: inherit;
  width: 100% !important;
  box-sizing: border-box !important;
  line-height: 1.5 !important;
  resize: vertical !important;
  overflow: auto !important;
  /* Blindaje (2026-06-11): ninguna palabra/ejemplo largo puede salirse del marco. */
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  max-width: 100% !important;
}
textarea.wizard-quick-input {
  min-height: 96px !important;
  display: block;
}
/* Etiquetas y hints del wizard: envolver siempre, nunca desbordar la tarjeta. */
.wizard-quick-label,
.wizard-quick .u-text-mute,
.wizard-quick-title,
.wizard-quick-subtitle {
  overflow-wrap: break-word;
  word-break: break-word;
  max-width: 100%;
}
#wqNegocio.wizard-quick-input { min-height: 120px !important; }
#wqBloqueo.wizard-quick-input { min-height: 96px !important; }
#wqYaIntento.wizard-quick-input { min-height: 96px !important; }
input.wizard-quick-input { min-height: 44px !important; }
/* Fix: browser renders <option> with system-white bg but inherited white text → invisible.
   Force dark background on dropdown options so white text is legible. */
select.wizard-quick-input option {
  background: #1e1b4b;
  color: #ffffff;
}
.wizard-quick-input::placeholder { color: rgba(199,210,254,0.5); font-style: italic; }
.wizard-quick-input:focus {
  border-color: #fbbf24 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(251,191,36,0.18) !important;
}
/* Economic fields section – dark theme */
.wizard-econ-fields {
  background: rgba(255,255,255,0.04);
  border: 1.5px solid rgba(167,139,250,0.18);
}
.wizard-econ-fields > div:first-child {
  color: #c7d2fe;
}
.wizard-econ-fields .wizard-quick-label {
  color: #c7d2fe !important;
}
.wizard-econ-hint {
  color: rgba(199,210,254,0.5);
}
.wizard-quick-submit {
  background: var(--grad-premium-action) !important;
  color: #ffffff !important;
  border: none !important;
  padding: var(--space-3h) var(--space-5) !important;
  border-radius: var(--radius-lg) !important;
  font-weight: 800 !important;
  font-size: var(--text-base) !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-top: 28px !important;
  width: 100%;
  cursor: pointer;
  box-shadow: var(--shadow-premium-md);
  transition: transform 0.2s, box-shadow 0.2s;
}
.wizard-quick-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(99,102,241,0.45);
}

/* ─── Toast Copiado ─────────────────────────────────────────────── */
.premium-toast {
  position: fixed;
  bottom: var(--space-6);
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: var(--grad-premium-dark);
  color: #ffffff;
  padding: var(--space-2h) 22px;
  border-radius: 999px;
  font-size: var(--text-body);
  font-weight: 700;
  box-shadow: var(--shadow-premium-lg);
  border: var(--border-premium-gold);
  z-index: var(--z-tooltip);
  opacity: 0;
  transition: opacity 0.3s, transform 0.3s;
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.premium-toast::before {
  content: "✓";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--space-4h);
  height: var(--space-4h);
  border-radius: 50%;
  background: var(--grad-premium-gold);
  color: #1e1b4b;
  font-size: var(--text-xs);
  font-weight: 900;
}
.premium-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ─── Mobile responsive ─────────────────────────────────────────── */
@media (max-width: 480px) {
  .money-tracker-amount { font-size: var(--text-3xl); }
  .money-tracker-stats { grid-template-columns: 1fr 1fr; }
  .day1-title { font-size: var(--text-2xl) !important; }
  .d1w-title { font-size: 1.45rem !important; }
  .wizard-quick { padding: var(--space-5) var(--space-4h) !important; }
  .wizard-quick-title { font-size: var(--text-2xl) !important; }
}

/* ═══════════════════════════════════════════════════════════════════
   COMPROMISO DÍA 1 — Contrato visible al inicio del plan día 1
   Convierte "leí un PDF" en "firmé un contrato con mi mentor".
   ═══════════════════════════════════════════════════════════════════ */

.compromiso-card {
  margin: var(--space-3h) 0 var(--space-4h);
  padding: 22px 24px;
  background: linear-gradient(135deg, #0f0a2e 0%, #1e1b4b 50%, #312e81 100%);
  border: var(--space-px) solid rgba(251, 191, 36, 0.55);
  border-radius: 18px;
  box-shadow: 0 12px 40px rgba(15, 10, 46, 0.28), 0 0 0 1px rgba(251, 191, 36, 0.2);
  position: relative;
  overflow: hidden;
  animation: premiumFadeUp 0.6s ease;
}
.compromiso-card::before {
  content: "";
  position: absolute;
  top: 0; left: -50%;
  width: 200%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(251, 191, 36, 0.08), transparent);
  background-size: 200% 100%;
  animation: premiumShimmer 5s linear infinite;
  pointer-events: none;
}
.compromiso-badge {
  display: inline-block;
  background: linear-gradient(135deg, #fbbf24, #d97706);
  color: #1e1b4b;
  font-weight: 900;
  font-size: var(--text-xs);
  padding: var(--space-1) var(--space-3h);
  border-radius: 999px;
  letter-spacing: 0.16em;
  margin-bottom: var(--space-3);
  box-shadow: 0 4px 14px rgba(251, 191, 36, 0.4);
  position: relative;
  z-index: var(--z-local);
}
.compromiso-texto {
  font-size: var(--text-md);
  font-weight: 600;
  color: #ffffff;
  line-height: 1.55;
  margin-bottom: var(--space-3);
  position: relative;
  z-index: var(--z-local);
  font-style: italic;
}
.compromiso-deadline {
  font-size: var(--text-body);
  color: #fde68a;
  margin-bottom: var(--space-1h);
  position: relative;
  z-index: var(--z-local);
}
.compromiso-deadline strong {
  color: #fbbf24;
  font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
}
.compromiso-consecuencia {
  font-size: var(--text-xs-plus);
  color: #c4b5fd;
  font-style: italic;
  margin-bottom: var(--space-3h);
  padding-left: var(--space-2h);
  border-left: var(--space-px) solid rgba(167, 139, 250, 0.4);
  position: relative;
  z-index: var(--z-local);
}
.compromiso-checkbox-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2h) var(--space-3);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(167, 139, 250, 0.25);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-2h);
  cursor: pointer;
  position: relative;
  z-index: var(--z-local);
  transition: background 0.2s, border-color 0.2s;
}
.compromiso-checkbox-row:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(251, 191, 36, 0.4);
}
.compromiso-checkbox-row input[type="checkbox"] {
  width: var(--space-4h);
  height: var(--space-4h);
  accent-color: #fbbf24;
  cursor: pointer;
}
.compromiso-checkbox-row span {
  font-size: var(--text-base);
  color: #e0e7ff;
  font-weight: 500;
}
.compromiso-btn-firmar {
  width: 100%;
  padding: var(--space-3) var(--space-5);
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  color: #ffffff;
  border: none;
  border-radius: 12px;
  font-size: var(--text-base);
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(99, 102, 241, 0.32);
  transition: transform 0.2s, box-shadow 0.2s, opacity 0.2s;
  position: relative;
  z-index: var(--z-local);
}
.compromiso-btn-firmar:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(99, 102, 241, 0.45);
}
.compromiso-btn-firmar:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
}

/* Estado FIRMADO */
.compromiso-card.compromiso-firmado {
  background: linear-gradient(135deg, #064e3b 0%, #065f46 50%, #047857 100%);
  border-color: rgba(52, 211, 153, 0.6);
  box-shadow: 0 12px 40px rgba(6, 95, 70, 0.32), 0 0 0 1px rgba(52, 211, 153, 0.25);
}
.compromiso-card.compromiso-firmado::before {
  background: linear-gradient(90deg, transparent, rgba(52, 211, 153, 0.1), transparent);
}
.compromiso-card.compromiso-firmado .compromiso-badge {
  background: linear-gradient(135deg, #34d399, #10b981);
  color: #064e3b;
  box-shadow: 0 4px 14px rgba(52, 211, 153, 0.4);
}
.compromiso-card.compromiso-firmado .compromiso-texto {
  color: #d1fae5;
  font-style: normal;
}
.compromiso-card.compromiso-firmado .compromiso-deadline {
  color: #a7f3d0;
}
.compromiso-card.compromiso-firmado .compromiso-deadline strong {
  color: #6ee7b7;
}
.compromiso-firmado-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2h) var(--space-3);
  background: rgba(52, 211, 153, 0.12);
  border: 1px solid rgba(52, 211, 153, 0.35);
  border-radius: var(--radius-md);
  font-size: var(--text-body);
  font-weight: 600;
  color: #d1fae5;
  position: relative;
  z-index: var(--z-local);
}
.compromiso-firmado-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--space-5);
  height: var(--space-5);
  border-radius: 50%;
  background: linear-gradient(135deg, #34d399, #10b981);
  color: #064e3b;
  font-size: var(--text-base);
  font-weight: 900;
}

@media (max-width: 480px) {
  .compromiso-card { padding: var(--space-4) var(--space-4); }
  .compromiso-texto { font-size: var(--text-base); }
}

/* ============================================
   TIER SPRINT 30 — Tema premium teal/cyan + amber
   Se aplica a #pantallaProgreso cuando el usuario es Sprint 30.
   Distinto del indigo-gold de Momentum 90, pero igualmente premium.
   ============================================ */

.tier-sprint30 {
  background:
    radial-gradient(circle at 15% 0%, rgba(20, 184, 166, 0.06) 0%, transparent 45%),
    radial-gradient(circle at 85% 100%, rgba(245, 158, 11, 0.04) 0%, transparent 50%),
    linear-gradient(180deg, #f8fffe 0%, #ffffff 50%, #f9fffe 100%);
  position: relative;
}

/* Sprint 30 bienvenida — teal accent instead of default indigo */
.tier-sprint30 .bienvenida {
  border-top: 3px solid #14b8a6;
  box-shadow: 0 4px 14px -4px rgba(20, 184, 166, 0.12);
}

.tier-badge-sprint {
  display: inline-block;
  padding: var(--space-1) var(--space-3);
  background: linear-gradient(135deg, #14b8a6 0%, #0d9488 50%, #f59e0b 100%);
  background-size: 200% 100%;
  color: #021310;
  font-weight: 900;
  font-size: var(--text-xs-plus);
  letter-spacing: 1.4px;
  border-radius: 999px;
  border: 1px solid rgba(245, 158, 11, 0.4);
  box-shadow:
    0 0 0 1px rgba(20, 184, 166, 0.3),
    0 4px 14px rgba(20, 184, 166, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
  animation: tier-sprint-shimmer 4s ease-in-out infinite;
}

@keyframes tier-sprint-shimmer {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* Plan card */
.tier-sprint30 .day1-premium-wrapper {
  background:
    linear-gradient(180deg, #0a2e2a 0%, #0d3d36 40%, #f0fdfa 100%);
  border: 1px solid rgba(20, 184, 166, 0.30);
  border-radius: 22px;
  box-shadow:
    0 0 0 1px rgba(20, 184, 166, 0.15),
    0 20px 60px -16px rgba(20, 184, 166, 0.25),
    0 8px 24px -8px rgba(0, 0, 0, 0.12);
  padding: 0;
  margin-bottom: var(--space-5);
  position: relative;
  overflow: hidden;
}

.tier-sprint30 .day1-premium-wrapper::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: conic-gradient(from 0deg, transparent 60%, rgba(20, 184, 166, 0.15) 70%, transparent 80%);
  animation: tier-sprint-glow 8s linear infinite;
  pointer-events: none;
  opacity: 0.4;
}

@keyframes tier-sprint-glow {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.tier-sprint30 .day1-header {
  position: relative;
  z-index: var(--z-above);
  text-align: center;
  padding: 22px 22px 14px;
}

.tier-sprint30 .day1-badge {
  display: inline-block;
  padding: 5px 14px;
  background: linear-gradient(135deg, #f59e0b, #fbbf24);
  color: #1f1305;
  font-weight: 900;
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  border-radius: 999px;
  margin-bottom: var(--space-2);
}

.tier-sprint30 .day1-title {
  font-size: var(--text-3xl);
  font-weight: 900;
  background: linear-gradient(135deg, #5eead4 0%, #14b8a6 50%, #f59e0b 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  margin: var(--space-0) 0 var(--space-1);
}

.tier-sprint30 .day1-subtitle {
  color: rgba(94, 234, 212, 0.75);
  font-size: var(--text-base);
}

/* Premium audit Apr 2026: removed dark plan-card override for tier-sprint30.
 * Used to force the plan card into a dark teal theme that fought with the
 * white container. Base .plan-card (white) now wins. Day-1 wrapper still has
 * its own dark celebration via .day1-premium-wrapper. */
/* Plan-card inside day1 wrapper: premium light gradient with teal hint.
 * Not plain white — subtle depth for a $499 product feel. Text is dark
 * (var(--ink)) so all today-zone rules work naturally. */
.tier-sprint30 .day1-premium-wrapper .plan-card {
  background: linear-gradient(180deg, #f0fdfa 0%, #ffffff 30%, #fefffe 100%) !important;
  border: none !important;
  border-top: 1px solid rgba(20, 184, 166, 0.12) !important;
  border-radius: 0 0 22px 22px !important;
}

/* Day1 sections inside white plan-card: teal accent bg with dark readable text */
.tier-sprint30 .day1-section {
  background: rgba(20, 184, 166, 0.06);
  border-left: 3px solid #14b8a6;
  border-radius: 12px;
  padding: var(--space-3h) var(--space-4);
  margin: var(--space-3) var(--space-4);
}

.tier-sprint30 .day1-section-title {
  color: #0d9488;
  font-weight: 800;
  font-size: var(--text-body);
  letter-spacing: 0.6px;
  text-transform: uppercase;
  margin-bottom: var(--space-1h);
}

.tier-sprint30 .day1-section-body {
  color: #1e293b;
  font-size: 0.97rem;
  line-height: 1.55;
}

.tier-sprint30 .compromiso-card {
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.18) 0%, rgba(20, 184, 166, 0.12) 100%);
  border: 1.5px solid rgba(245, 158, 11, 0.4);
  box-shadow:
    0 0 30px rgba(245, 158, 11, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.tier-sprint30 .compromiso-badge {
  background: linear-gradient(135deg, #f59e0b, #fbbf24);
  color: #1f1305;
}

/* Premium audit: phase-badge override scoped to day1 wrapper only */
.tier-sprint30 .day1-premium-wrapper .phase-badge {
  background: linear-gradient(135deg, rgba(20, 184, 166, 0.25), rgba(13, 148, 136, 0.18)) !important;
  border: 1px solid rgba(20, 184, 166, 0.5) !important;
  color: #5eead4 !important;
  box-shadow: 0 2px 12px rgba(20, 184, 166, 0.2) !important;
}

.tier-sprint30 .compromiso-btn-firmar {
  background: linear-gradient(135deg, #14b8a6 0%, #0d9488 50%, #f59e0b 100%);
  background-size: 200% 100%;
  color: #021310;
  font-weight: 900;
  border: none;
  box-shadow: 0 4px 18px rgba(20, 184, 166, 0.35);
  transition: all 0.3s ease;
}

.tier-sprint30 .compromiso-btn-firmar:hover:not(:disabled) {
  background-position: 100% 50%;
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(20, 184, 166, 0.5);
}

.tier-sprint30 .day1-roadmap-item {
  background: rgba(20, 184, 166, 0.06);
  border: 1px solid rgba(20, 184, 166, 0.2);
  border-radius: var(--radius-md);
  padding: var(--space-2) var(--space-3);
  margin-bottom: var(--space-1h);
  color: #1e293b;
}

.tier-sprint30 .day1-revenue-target {
  color: #0d9488;
  font-weight: 800;
}

/* ============================================
   TIER SPRINT 30 — Mentor Context Box DAY-1 ONLY overrides
   PREMIUM AUDIT Apr 2026: estos overrides convertían #mentorContextBox y
   todas las secciones .mc-* a tema OSCURO teal/amber. Eso era coherente con
   un viejo "Sprint 30 dark dashboard" que ya no existe. Hoy el dashboard usa
   superficie blanca premium, y las base classes .mc-* ya están diseñadas
   para tema claro (fondo blanco, texto índigo). Por eso las cards oscuras
   se veían como manchas flotantes sobre el container blanco.
   FIX: scope TODOS estos overrides a `.day1-premium-wrapper` (que sí existe
   sólo el día 1 y mantiene su look celebratorio dark). Los días 2..30/90
   usan el tema light premium base.
   ============================================ */

.tier-sprint30 .day1-premium-wrapper #mentorContextBox {
  background: linear-gradient(180deg, rgba(6, 26, 31, 0.85) 0%, rgba(10, 31, 41, 0.92) 100%);
  border: 1px solid rgba(20, 184, 166, 0.25);
  border-radius: 18px;
  padding: var(--space-4h) 22px;
  margin-bottom: 22px;
  box-shadow:
    0 0 0 1px rgba(20, 184, 166, 0.12),
    0 16px 60px -16px rgba(20, 184, 166, 0.3),
    0 6px 20px -8px rgba(0, 0, 0, 0.55),
    inset 0 1px 0 rgba(94, 234, 212, 0.08);
  backdrop-filter: blur(8px);
  position: relative;
  overflow: hidden;
}

.tier-sprint30 .day1-premium-wrapper #mentorContextBox::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: var(--space-px);
  background: linear-gradient(90deg, transparent, #14b8a6 30%, #f59e0b 70%, transparent);
  opacity: 0.6;
}

/* ── LEVEL BADGE + REASONING ── */
.tier-sprint30 .day1-premium-wrapper .mc-level { margin-bottom: var(--space-3h); }

.tier-sprint30 .day1-premium-wrapper .mc-level-badge {
  background: linear-gradient(135deg, #14b8a6 0%, #0d9488 50%, #f59e0b 100%);
  background-size: 200% 100%;
  color: #021310;
  text-shadow: 0 1px 0 rgba(255,255,255,0.2);
  border: 1px solid rgba(245, 158, 11, 0.35);
  box-shadow:
    0 0 0 1px rgba(20, 184, 166, 0.3),
    0 4px 14px rgba(20, 184, 166, 0.28),
    inset 0 1px 0 rgba(255,255,255,0.25);
  animation: tier-sprint-shimmer 5s ease-in-out infinite;
}

.tier-sprint30 .day1-premium-wrapper .mc-level-badge.mc-lvl-vendedor       { background: linear-gradient(135deg, #10b981, #34d399); color: #022c22; }
.tier-sprint30 .day1-premium-wrapper .mc-level-badge.mc-lvl-primer_cierre  { background: linear-gradient(135deg, #06b6d4, #22d3ee); color: #042f3a; }
.tier-sprint30 .day1-premium-wrapper .mc-level-badge.mc-lvl-avanzado_baseline { background: linear-gradient(135deg, #14b8a6 0%, #0d9488 50%, #f59e0b 100%); color: #021310; }
.tier-sprint30 .day1-premium-wrapper .mc-level-badge.mc-lvl-gen_leads      { background: linear-gradient(135deg, #14b8a6, #5eead4); color: #021310; }
.tier-sprint30 .day1-premium-wrapper .mc-level-badge.mc-lvl-primeras_senales { background: linear-gradient(135deg, #0891b2, #06b6d4); color: #042f3a; }
.tier-sprint30 .day1-premium-wrapper .mc-level-badge.mc-lvl-en_movimiento  { background: linear-gradient(135deg, #f59e0b, #fbbf24); color: #1f1305; }
.tier-sprint30 .day1-premium-wrapper .mc-level-badge.mc-lvl-arrancando     { background: linear-gradient(135deg, #475569, #64748b); color: #f1f5f9; }
.tier-sprint30 .day1-premium-wrapper .mc-level-badge.mc-lvl-dia_1          { background: linear-gradient(135deg, #0d9488, #14b8a6); color: #021310; }

.tier-sprint30 .day1-premium-wrapper .mc-level-reasoning {
  color: #d1fae5;
  font-style: italic;
  border-left: 3px solid #14b8a6;
  padding: var(--space-1h) var(--space-2h);
  background: rgba(20, 184, 166, 0.06);
  border-radius: 0 8px 8px 0;
  font-size: var(--text-base);
  line-height: 1.65;
}

/* ── SECTIONS GENERIC ── */
.tier-sprint30 .day1-premium-wrapper .mc-section {
  background: rgba(6, 26, 31, 0.55);
  border: 1px solid rgba(20, 184, 166, 0.18);
  border-radius: 12px;
  padding: var(--space-3) var(--space-3h);
  margin-top: var(--space-3);
  box-shadow:
    0 0 0 1px rgba(20, 184, 166, 0.05),
    0 4px 16px -8px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(94, 234, 212, 0.06);
}

.tier-sprint30 .day1-premium-wrapper .mc-section-title {
  color: #5eead4;
  font-weight: 800;
  font-size: var(--text-sm);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: var(--space-2);
}

/* ── OBJETIVO ── */
.tier-sprint30 .day1-premium-wrapper .mc-section-obj { border-left: var(--space-0) solid #14b8a6; }
.tier-sprint30 .day1-premium-wrapper .mc-obj-text {
  color: #f0fdfa;
  font-weight: 700;
  font-size: var(--text-base);
  margin-bottom: var(--space-2);
}
.tier-sprint30 .day1-premium-wrapper .mc-obj-bar {
  background: rgba(20, 184, 166, 0.15);
  height: var(--space-2);
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid rgba(20, 184, 166, 0.2);
}
.tier-sprint30 .day1-premium-wrapper .mc-obj-bar-fill {
  background: linear-gradient(90deg, #14b8a6, #5eead4);
  box-shadow: 0 0 8px rgba(94, 234, 212, 0.4);
}
.tier-sprint30 .day1-premium-wrapper .mc-obj-bar-fill.behind {
  background: linear-gradient(90deg, #f59e0b, #fbbf24);
  box-shadow: 0 0 8px rgba(251, 191, 36, 0.4);
}
.tier-sprint30 .day1-premium-wrapper .mc-obj-progress { color: var(--ink-mute-dark); font-size: var(--text-sm); margin-top: var(--space-1); }
.tier-sprint30 .day1-premium-wrapper .mc-obj-status-ok {
  background: rgba(20, 184, 166, 0.15);
  color: #5eead4;
  border-left: 3px solid #14b8a6;
}
.tier-sprint30 .day1-premium-wrapper .mc-obj-status-behind {
  background: rgba(245, 158, 11, 0.15);
  color: #fbbf24;
  border-left: 3px solid #f59e0b;
}
.tier-sprint30 .day1-premium-wrapper .mc-obj-no-goal {
  background: rgba(148, 163, 184, 0.1);
  color: var(--ink-mute-dark);
  font-style: italic;
}

/* ── FOCO OPERATIVO ── */
.tier-sprint30 .day1-premium-wrapper .mc-section-foco { border-left: var(--space-0) solid #06b6d4; }
.tier-sprint30 .day1-premium-wrapper .mc-tag-etapa {
  background: rgba(20, 184, 166, 0.15);
  color: #5eead4;
  border: 1px solid rgba(20, 184, 166, 0.4);
  font-weight: 700;
}
.tier-sprint30 .day1-premium-wrapper .mc-tag-fase {
  background: rgba(6, 182, 212, 0.15);
  color: #67e8f9;
  border: 1px solid rgba(6, 182, 212, 0.4);
  font-weight: 700;
}
.tier-sprint30 .day1-premium-wrapper .mc-foco-desc {
  color: #d1fae5;
  font-size: var(--text-base);
  line-height: 1.65;
}

/* ── MODO BADGE ── */
.tier-sprint30 .day1-premium-wrapper .mc-modo {
  background: rgba(6, 26, 31, 0.7);
  border: 1px solid rgba(20, 184, 166, 0.25);
  border-radius: var(--radius-md);
  padding: var(--space-2h) var(--space-3);
  margin: var(--space-1) 0 var(--space-3);
}
.tier-sprint30 .day1-premium-wrapper .mc-modo-badge {
  box-shadow: 0 0 0 1px rgba(255,255,255,0.1), 0 4px 14px rgba(0,0,0,0.4);
  text-shadow: 0 1px 0 rgba(0,0,0,0.25);
}
.tier-sprint30 .day1-premium-wrapper .mc-modo-scale    { background: linear-gradient(135deg, #10b981, #34d399); color: #022c22; }
.tier-sprint30 .day1-premium-wrapper .mc-modo-close    { background: linear-gradient(135deg, #06b6d4, #22d3ee); color: #042f3a; }
.tier-sprint30 .day1-premium-wrapper .mc-modo-adjust   { background: linear-gradient(135deg, #f59e0b, #fbbf24); color: #1f1305; }
.tier-sprint30 .day1-premium-wrapper .mc-modo-outreach { background: linear-gradient(135deg, #14b8a6, #5eead4); color: #021310; }
.tier-sprint30 .day1-premium-wrapper .mc-modo-desc {
  color: #d1fae5;
  font-style: italic;
}

/* ── DESFASE (positive: user ahead of calendar) ── */
.tier-sprint30 .day1-premium-wrapper .mc-desfase {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.18) 0%, rgba(52, 211, 153, 0.1) 100%);
  border: 1px solid rgba(16, 185, 129, 0.45);
  border-left: var(--space-0) solid #10b981;
  box-shadow: 0 0 16px rgba(16, 185, 129, 0.15);
}
.tier-sprint30 .day1-premium-wrapper .mc-desfase-title {
  color: #34d399;
  text-shadow: 0 1px 8px rgba(52, 211, 153, 0.3);
}
.tier-sprint30 .day1-premium-wrapper .mc-desfase-msg {
  color: #a7f3d0;
}

/* ── DIAGNÓSTICO ── */
.tier-sprint30 .day1-premium-wrapper .mc-section-diag { border-left: var(--space-0) solid #22d3ee; }
.tier-sprint30 .day1-premium-wrapper .mc-diag-list li {
  color: #d1fae5;
  font-size: var(--text-base);
  line-height: 1.65;
}
.tier-sprint30 .day1-premium-wrapper .mc-diag-list li::before {
  color: #22d3ee;
  text-shadow: 0 0 4px rgba(34, 211, 238, 0.5);
}

/* ── PREGUNTA DEL DÍA ── */
.tier-sprint30 .day1-premium-wrapper .mc-section-question {
  border-left: var(--space-0) solid #fbbf24;
  background:
    linear-gradient(135deg, rgba(245, 158, 11, 0.12) 0%, rgba(6, 26, 31, 0.5) 100%);
}
.tier-sprint30 .day1-premium-wrapper .mc-section-question .mc-section-title { color: #fbbf24; }
.tier-sprint30 .day1-premium-wrapper .mc-question-text {
  color: #fef3c7;
  font-weight: 600;
  font-style: italic;
  font-size: var(--text-base);
}
.tier-sprint30 .day1-premium-wrapper .mc-question-intro {
  color: var(--ink-mute-dark);
  font-size: var(--text-sm);
}

/* ── PROGRESIÓN ── */
.tier-sprint30 .day1-premium-wrapper .mc-section-prog { border-left: var(--space-0) solid #34d399; }
.tier-sprint30 .day1-premium-wrapper .mc-prog-summary { color: #d1fae5; font-size: var(--text-body); }
.tier-sprint30 .day1-premium-wrapper .mc-prog-metrics { color: var(--ink-mute-dark); font-size: var(--text-sm); }
.tier-sprint30 .day1-premium-wrapper .mc-prog-metrics strong {
  color: #5eead4;
  font-weight: 800;
}

/* ── BLOQUE AYER → HOY ── */
.tier-sprint30 .day1-premium-wrapper .mc-ayer {
  background:
    linear-gradient(135deg, rgba(20, 184, 166, 0.08) 0%, rgba(6, 182, 212, 0.06) 100%);
  border: 1px solid rgba(20, 184, 166, 0.3);
  border-radius: var(--radius-lg);
  padding: var(--space-3h) var(--space-4);
  box-shadow: 0 0 0 1px rgba(20, 184, 166, 0.08), 0 4px 20px -8px rgba(0,0,0,0.5);
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-title {
  color: #5eead4;
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-yesterday {
  background: rgba(6, 26, 31, 0.6);
  border: 1px dashed rgba(94, 234, 212, 0.35);
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-yesterday-header {
  color: var(--ink-mute-dark);
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-yesterday-metrics {
  color: #f0fdfa;
  font-weight: 700;
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-yesterday-line {
  color: var(--ink-mute-dark);
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-yesterday-line strong {
  color: #5eead4;
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-arrow {
  color: #14b8a6;
  text-shadow: 0 0 12px rgba(20, 184, 166, 0.5);
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-today {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.15) 0%, rgba(20, 184, 166, 0.08) 100%);
  border: 1.5px solid rgba(245, 158, 11, 0.4);
  border-left: var(--space-0) solid #f59e0b;
  box-shadow: 0 0 18px rgba(245, 158, 11, 0.1);
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-today-header {
  color: #fbbf24;
}
.tier-sprint30 .day1-premium-wrapper .mc-ayer-today-msg {
  color: #fef3c7;
  font-weight: 600;
}

/* =================================================================
   PREMIUM v6 — Adaptive Intelligence visual layer
   B9/B10/B11/B12/B13/B14 + C15/C16/C17/C18/C20
   ================================================================= */

/* === BLOQUE F6 — Achievement unlock badge === */
.logro-unlock-badge {
  display: inline-block;
  margin-top: var(--space-1);
  padding: var(--space-0) var(--space-2);
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.18) 0%, rgba(79, 70, 229, 0.10) 100%);
  border: 1px solid rgba(212, 175, 55, 0.45);
  border-radius: 999px;
  font-size: var(--text-xs);
  color: #b8860b;
  font-weight: 600;
  cursor: help;
}
.logro-unlock-badge strong {
  color: #4f46e5;
  font-weight: 700;
}
.logro-card.logro-with-unlock {
  border-color: rgba(212, 175, 55, 0.40);
  box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.20), 0 2px 8px rgba(79, 70, 229, 0.06);
}

/* === BLOQUE D — Mentor Estratégico M90 (Outcome contractualizado) === */
.mentor-panel {
  margin: var(--space-4) 0;
  padding: var(--space-5);
  background: linear-gradient(135deg, rgba(79, 70, 229, 0.08) 0%, rgba(212, 175, 55, 0.05) 100%);
  border: 1px solid rgba(79, 70, 229, 0.20);
  border-left: var(--space-0) solid #d4af37;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md, 0 2px 8px rgba(79, 70, 229, 0.08));
  position: relative;
  overflow: hidden;
}
.mentor-panel::before {
  content: "";
  position: absolute;
  top: 0; right: 0;
  width: 80px;
  height: 80px;
  background: radial-gradient(circle at top right, rgba(212, 175, 55, 0.18) 0%, transparent 70%);
  pointer-events: none;
}
.mentor-panel-head {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}
.mentor-panel-icon {
  font-size: var(--text-4xl);
  color: #d4af37;
  text-shadow: 0 1px 3px rgba(79, 70, 229, 0.25);
}
.mentor-panel-titles { flex: 1; }
.mentor-panel-title {
  font-size: var(--text-md);
  font-weight: var(--weight-bold);
  color: #4f46e5;
  letter-spacing: 0.01em;
}
.mentor-panel-sub {
  font-size: var(--text-xs);
  color: var(--gray-600, #4b5563);
  margin-top: var(--space-px);
}
.mentor-panel-eta {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  font-size: var(--text-sm);
  color: var(--gray-700, #374151);
  margin-bottom: var(--space-3);
  padding: var(--space-2) var(--space-3);
  background: rgba(255, 255, 255, 0.5);
  border-radius: var(--radius-sm);
}
.mentor-panel-eta.mentor-state-pending {
  background: rgba(212, 175, 55, 0.10);
  color: #b8860b;
  font-weight: var(--weight-medium);
}
.mentor-panel-dot { color: #d4af37; opacity: 0.6; }
.mentor-export-btn {
  display: block;
  width: 100%;
  margin-bottom: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
  color: #fff;
  border: 1px solid rgba(212, 175, 55, 0.45);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  cursor: pointer;
  transition: transform var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out);
  box-shadow: 0 2px 6px rgba(79, 70, 229, 0.20);
}
.mentor-export-btn:hover:not(.disabled) {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(79, 70, 229, 0.30), 0 0 0 1px rgba(212, 175, 55, 0.6);
}
.mentor-export-btn.disabled {
  background: rgba(79, 70, 229, 0.10);
  color: var(--gray-600, #4b5563);
  cursor: not-allowed;
  border-color: rgba(79, 70, 229, 0.18);
  box-shadow: none;
}
.mentor-reviews-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.mentor-review-card {
  background: #ffffff;
  border: 1px solid rgba(79, 70, 229, 0.15);
  border-left: 3px solid #d4af37;
  border-radius: var(--radius-md);
  padding: var(--space-4);
  box-shadow: 0 1px 3px rgba(79, 70, 229, 0.05);
}
.mentor-review-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: var(--space-2);
  gap: var(--space-2);
  flex-wrap: wrap;
}
.mentor-review-month {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: #d4af37;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.mentor-review-meta {
  font-size: var(--text-xs);
  color: var(--gray-500, #6b7280);
  font-style: italic;
}
.mentor-review-title {
  font-size: var(--text-md);
  font-weight: var(--weight-bold);
  color: #1f2937;
  margin-bottom: var(--space-3);
  line-height: 1.3;
}
.mentor-review-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.mentor-review-section {
  padding-left: var(--space-3);
  border-left: var(--space-px) solid rgba(79, 70, 229, 0.20);
}
.mentor-review-section.section-diag { border-left-color: #6366f1; }
.mentor-review-section.section-ok { border-left-color: #10b981; }
.mentor-review-section.section-adjust { border-left-color: #f59e0b; }
.mentor-review-section.section-next { border-left-color: #d4af37; }
.mentor-review-label {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--gray-700, #374151);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--space-0);
}
.mentor-review-value {
  font-size: var(--text-sm);
  color: var(--gray-800, #1f2937);
  line-height: 1.55;
  white-space: pre-wrap;
}
.mentor-review-targets {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  padding-top: var(--space-2);
  border-top: 1px dashed rgba(79, 70, 229, 0.18);
  font-size: var(--text-xs);
}
.mentor-target-label {
  font-weight: var(--weight-bold);
  color: var(--gray-700, #374151);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.mentor-target-pill {
  background: rgba(79, 70, 229, 0.10);
  color: #4f46e5;
  padding: var(--space-px) var(--space-1h);
  border-radius: 999px;
  font-weight: var(--weight-bold);
}

/* Banner unread en TAB Today */
.mentor-unread-banner {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin: var(--space-3) 0;
  padding: var(--space-3) var(--space-4);
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.18) 0%, rgba(79, 70, 229, 0.08) 100%);
  border: 1px solid rgba(212, 175, 55, 0.40);
  border-left: var(--space-0) solid #d4af37;
  border-radius: var(--radius-md);
  box-shadow: 0 2px 8px rgba(212, 175, 55, 0.10);
  position: relative;
  overflow: hidden;
}
.mentor-unread-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, 0.4) 50%, transparent 70%);
  background-size: 200% 100%;
  animation: mentorShimmer 3s ease-in-out infinite;
  pointer-events: none;
}
@keyframes mentorShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.mentor-unread-icon {
  font-size: var(--text-4xl);
  color: #d4af37;
  z-index: var(--z-local);
}
.mentor-unread-text { flex: 1; z-index: var(--z-local); }
.mentor-unread-title {
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  color: #4f46e5;
  margin-bottom: var(--space-px);
}
.mentor-unread-body {
  font-size: var(--text-xs);
  color: var(--gray-700, #374151);
}
.mentor-unread-cta {
  background: #4f46e5;
  color: #fff;
  border: 1px solid rgba(212, 175, 55, 0.5);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  cursor: pointer;
  z-index: var(--z-local);
}
.mentor-unread-cta:hover {
  background: #4338ca;
  box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.5);
}

/* === BLOQUE B — Sprint con reloj: cycle clock + lag banner === */
.cycle-clock-panel {
  margin: var(--space-4) 0;
  padding: var(--space-4) var(--space-5);
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.06) 0%, rgba(99, 102, 241, 0.04) 100%);
  border: 1px solid rgba(59, 130, 246, 0.18);
  border-left: var(--space-0) solid #3b82f6;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}
.cycle-clock-panel.state-atrasado {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.10) 0%, rgba(217, 119, 6, 0.04) 100%);
  border-color: rgba(245, 158, 11, 0.30);
  border-left-color: #f59e0b;
}
.cycle-clock-panel.state-expirado {
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.10) 0%, rgba(185, 28, 28, 0.04) 100%);
  border-color: rgba(239, 68, 68, 0.30);
  border-left-color: #ef4444;
}
.cycle-clock-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: var(--space-2);
}
.cycle-clock-title {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: #1e40af;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.cycle-clock-panel.state-atrasado .cycle-clock-title { color: #b45309; }
.cycle-clock-panel.state-expirado .cycle-clock-title { color: #b91c1c; }
.cycle-clock-progress {
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  color: var(--gray-700, #374151);
}
.cycle-clock-bar {
  height: var(--space-1h);
  background: rgba(0, 0, 0, 0.06);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: var(--space-2);
}
.cycle-clock-fill {
  height: 100%;
  background: linear-gradient(90deg, #3b82f6 0%, #6366f1 100%);
  border-radius: 999px;
  transition: width var(--t-base) var(--ease-out);
}
.cycle-clock-panel.state-atrasado .cycle-clock-fill {
  background: linear-gradient(90deg, #f59e0b 0%, #d97706 100%);
}
.cycle-clock-panel.state-expirado .cycle-clock-fill {
  background: linear-gradient(90deg, #ef4444 0%, #b91c1c 100%);
}
.cycle-clock-meta {
  display: flex;
  justify-content: space-between;
  font-size: var(--text-xs);
  color: var(--gray-600, #4b5563);
  margin-bottom: var(--space-2);
}
.cycle-clock-lag,
.cycle-clock-debt {
  font-size: var(--text-sm);
  margin-top: var(--space-2);
  padding-top: var(--space-2);
  border-top: 1px dashed rgba(0, 0, 0, 0.10);
  color: var(--gray-800, #1f2937);
  font-weight: var(--weight-medium);
}
.cycle-clock-debt { color: #b91c1c; }

.cycle-lag-banner {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin: var(--space-3) 0;
  padding: var(--space-3) var(--space-5);
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.12) 0%, rgba(217, 119, 6, 0.06) 100%);
  border: 1px solid rgba(245, 158, 11, 0.30);
  border-left: var(--space-0) solid #f59e0b;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}
.cycle-lag-icon {
  font-size: var(--text-3xl);
}
.cycle-lag-text {
  flex: 1;
}
.cycle-lag-title {
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  color: #b45309;
  margin-bottom: var(--space-px);
}
.cycle-lag-body {
  font-size: var(--text-xs);
  color: var(--gray-700, #374151);
  line-height: 1.5;
}

/* === BLOQUE A — "AYER → HOY" — feedback loop visible === */
.ayer-hoy-banner {
  margin: var(--space-4) 0 var(--space-3);
  padding: var(--space-3) var(--space-5);
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.10) 0%, rgba(59, 130, 246, 0.06) 100%);
  border: 1px solid rgba(16, 185, 129, 0.22);
  border-left: var(--space-0) solid #10b981;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}
.ayer-hoy-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-2);
}
.ayer-hoy-icon {
  font-size: var(--text-md);
  color: #10b981;
  font-weight: var(--weight-bold);
}
.ayer-hoy-title {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: #047857;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.ayer-hoy-body {
  font-size: var(--text-sm);
  line-height: 1.5;
  color: var(--gray-800, #1f2937);
}
.tier-momentum .ayer-hoy-banner {
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.10) 0%, rgba(79, 70, 229, 0.06) 100%);
  border-color: rgba(212, 175, 55, 0.30);
  border-left-color: #d4af37;
}
.tier-momentum .ayer-hoy-icon { color: #d4af37; }
.tier-momentum .ayer-hoy-title { color: #b8860b; }

/* === MENTOR REASONING — DATO / DIAGNÓSTICO / PRESCRIPCIÓN === */
.mentor-reasoning-premium {
  margin: var(--space-4) 0;
  padding: var(--space-4) var(--space-5);
  background: linear-gradient(135deg, rgba(79, 70, 229, 0.06) 0%, rgba(37, 99, 235, 0.04) 100%);
  border: 1px solid rgba(79, 70, 229, 0.18);
  border-left: var(--space-0) solid var(--indigo);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--t-base) var(--ease-out), transform var(--t-base) var(--ease-out);
}
.mentor-reasoning-premium:hover {
  box-shadow: var(--shadow-glow-indigo);
}
.mentor-reasoning-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}
.mentor-reasoning-icon {
  font-size: var(--text-md);
}
.mentor-reasoning-title {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--indigo);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.mentor-reasoning-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.mr-line {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: var(--space-3);
  align-items: start;
  padding: var(--space-2) 0;
  border-top: 1px dashed rgba(79, 70, 229, 0.12);
}
.mr-line:first-child { border-top: none; padding-top: 0; }
.mr-tag {
  font-size: var(--text-xs);
  font-weight: var(--weight-black);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: var(--space-0) var(--space-1h);
  border-radius: var(--radius-pill);
  text-align: center;
  white-space: nowrap;
  align-self: flex-start;
}
.mr-tag-dato {
  background: rgba(37, 99, 235, 0.12);
  color: var(--primary-strong);
}
.mr-tag-diag {
  background: rgba(245, 158, 11, 0.14);
  color: var(--gold-strong);
}
.mr-tag-pres {
  background: rgba(15, 157, 116, 0.14);
  color: var(--success);
}
.mr-text {
  font-size: var(--text-sm);
  color: var(--ink);
  line-height: 1.55;
}
.mentor-reasoning-flat .mr-text {
  font-size: var(--text-sm);
  color: var(--ink);
  line-height: 1.6;
}

/* === EMPTY STATE mentor_reasoning (Fix 2026-04-11) === */
.mentor-reasoning-empty {
  opacity: 0.72;
}
.mr-empty {
  font-style: italic;
  color: var(--ink-soft);
}

/* === BRIEFING PANEL "lo que tu mentor está viendo" (Fix 2026-04-11) === */
.mentor-briefing-panel {
  margin: var(--space-4) 0 var(--space-3);
  padding: 0;
  background: rgba(15, 23, 42, 0.02);
  border: 1px dashed rgba(79, 70, 229, 0.28);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.mentor-briefing-panel[open] {
  background: rgba(79, 70, 229, 0.04);
  border-style: solid;
  border-color: rgba(79, 70, 229, 0.22);
}
.mentor-briefing-summary {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  cursor: pointer;
  list-style: none;
  user-select: none;
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--indigo);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.mentor-briefing-summary::-webkit-details-marker { display: none; }
.mentor-briefing-summary::marker { display: none; }
.mentor-briefing-icon {
  font-size: var(--text-md);
}
.mentor-briefing-title { flex: 1; }
.mentor-briefing-caret {
  transition: transform var(--t-base) var(--ease-out);
  color: var(--ink-soft);
}
.mentor-briefing-panel[open] .mentor-briefing-caret {
  transform: rotate(180deg);
}
.mentor-briefing-hint {
  padding: 0 var(--space-4) var(--space-2);
  font-size: var(--text-xs-plus);
  color: var(--ink-soft);
  font-style: italic;
}
.mentor-briefing-body {
  margin: 0;
  padding: var(--space-3) var(--space-4) var(--space-4);
  font-size: var(--text-sm);
  line-height: 1.55;
  color: var(--ink);
  background: #fff;
  border-top: 1px solid rgba(79, 70, 229, 0.12);
  white-space: pre-wrap;
  word-wrap: break-word;
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  max-height: 420px;
  overflow-y: auto;
}

/* === m90 strategic insight empty (Fix 2026-04-11) === */
.m90-strategic-card-empty { opacity: 0.78; }
.m90-strategic-empty {
  font-style: italic;
  color: var(--ink-soft);
}

/* === Fix A (audit 2026-04-17) — Cards premium: bottleneck, lead quality, cohort === */
.bottleneck-card, .lead-quality-card, .cohort-benchmark-card {
  background: linear-gradient(135deg, #fafbff 0%, #f0f5ff 100%);
  border: 1px solid #dce3f5;
  border-radius: 12px;
  padding: 16px 18px;
  margin: 14px 0;
  box-shadow: 0 2px 8px rgba(50, 64, 128, 0.05);
}
.bottleneck-card { border-left: 4px solid #ef4444; }
.lead-quality-card { border-left: 4px solid #10b981; }
.cohort-benchmark-card { border-left: 4px solid #6366f1; }

.bottleneck-head, .lead-quality-head, .cohort-benchmark-head {
  display: flex; align-items: center; gap: 8px; margin-bottom: 10px;
  font-weight: 700; color: #1e293b;
}
.bottleneck-icon, .lead-quality-icon, .cohort-benchmark-icon { font-size: 1.15rem; }
.bottleneck-title, .lead-quality-title, .cohort-benchmark-title { flex: 1; font-size: 0.95rem; }
.bottleneck-tag {
  background: #fee2e2; color: #991b1b; font-size: 0.7rem; font-weight: 700;
  padding: 3px 8px; border-radius: 10px; text-transform: uppercase; letter-spacing: 0.03em;
}
.bottleneck-body, .lead-quality-body, .cohort-benchmark-body {
  font-size: 0.88rem; color: #475569; line-height: 1.5;
}
.bottleneck-reason { margin-bottom: 8px; }
.bottleneck-missions, .lq-criterios, .lq-flags {
  margin: 6px 0 0 0; padding-left: 20px;
}
.bottleneck-missions li, .lq-criterios li, .lq-flags li { margin: 3px 0; }
.lq-good::marker { color: #10b981; }
.lq-bad::marker { color: #ef4444; }
.lq-flags-wrap { margin-top: 10px; }
.lq-question {
  margin-top: 10px; padding: 10px 12px;
  background: #eef2ff; border-radius: 8px;
  border-left: 3px solid #6366f1;
  font-style: italic;
}
.lq-question-label { font-weight: 700; color: #4338ca; font-style: normal; }

.cohort-benchmark-pos {
  font-size: 0.7rem; font-weight: 700; padding: 3px 9px; border-radius: 10px;
  text-transform: uppercase; letter-spacing: 0.03em;
}
.cohort-benchmark-pos-top_20 { background: #d1fae5; color: #065f46; }
.cohort-benchmark-pos-arriba_medio { background: #dbeafe; color: #1e40af; }
.cohort-benchmark-pos-abajo_medio { background: #fef3c7; color: #92400e; }
.cohort-benchmark-pos-bottom { background: #fee2e2; color: #991b1b; }
.cbench-msg { margin-bottom: 10px; font-weight: 500; }
.cbench-gap-grid {
  display: flex; flex-direction: column; gap: 4px;
  background: rgba(99, 102, 241, 0.05); padding: 10px; border-radius: 8px;
}
.cbench-row {
  display: flex; justify-content: space-between; gap: 10px;
  font-size: 0.82rem; padding: 3px 0;
}
.cbench-row span:first-child { color: #64748b; font-weight: 500; }
.cbench-row span:last-child { color: #1e293b; font-weight: 600; }

/* Tono cálido para emotional_stuck (I3) y estratégico para plateau (I4) */
.intervention-warm {
  background: linear-gradient(135deg, #ede9fe 0%, #f5f3ff 100%);
  border-left: 4px solid #7c3aed;
}
.intervention-strategy {
  background: linear-gradient(135deg, #fef3c7 0%, #fffbeb 100%);
  border-left: 4px solid #f59e0b;
}

/* === HIPÓTESIS BAJO PRUEBA — Premium === */
.hypothesis-premium {
  margin: var(--space-4) 0;
  padding: var(--space-4) var(--space-5);
  background: linear-gradient(135deg, #ffffff 0%, rgba(37, 99, 235, 0.04) 100%);
  border: 1.5px solid rgba(37, 99, 235, 0.22);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  position: relative;
  overflow: hidden;
  transition: transform var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out);
}
.hypothesis-premium::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--primary), var(--indigo), var(--primary));
  background-size: 200% 100%;
  animation: hypothesis-shimmer 4s linear infinite;
}
.hypothesis-premium:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-lg);
}
@keyframes hypothesis-shimmer {
  0% { background-position: 0% 0; }
  100% { background-position: 200% 0; }
}
.hypothesis-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}
.hypothesis-pulse {
  width: var(--space-1h);
  height: var(--space-1h);
  border-radius: 50%;
  background: var(--primary);
  box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.6);
  animation: pulse-blue 2s var(--ease-out) infinite;
}
@keyframes pulse-blue {
  0% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.6); }
  70% { box-shadow: 0 0 0 10px rgba(37, 99, 235, 0); }
  100% { box-shadow: 0 0 0 0 rgba(37, 99, 235, 0); }
}
.hypothesis-label {
  font-size: var(--text-xs);
  font-weight: var(--weight-black);
  color: var(--primary-strong);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.hypothesis-question {
  font-size: var(--text-md);
  font-weight: var(--weight-semi);
  color: var(--ink);
  line-height: 1.45;
  margin-bottom: var(--space-3);
}
.hypothesis-rule {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  background: rgba(15, 157, 116, 0.07);
  border-radius: var(--radius-md);
  border-left: 3px solid var(--success);
}
.hypothesis-rule-icon { flex-shrink: 0; }
.hypothesis-rule-label {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--success);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-right: var(--space-1);
}
.hypothesis-rule-text {
  font-size: var(--text-sm);
  color: var(--ink);
}

/* === SABIDURÍA APLICADA (principio + caso) === */
.wisdom-card {
  margin: var(--space-4) 0;
  padding: var(--space-4) var(--space-5);
  background: linear-gradient(160deg, #fff 0%, rgba(245, 158, 11, 0.04) 100%);
  border: 1px solid rgba(245, 158, 11, 0.2);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--t-base) var(--ease-out);
}
.wisdom-card:hover { box-shadow: var(--shadow-md); }
.wisdom-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}
.wisdom-icon { font-size: var(--text-md); }
.wisdom-title {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--gold-strong);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.wisdom-row {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: var(--space-3);
  padding: var(--space-2) 0;
  border-top: 1px dashed rgba(245, 158, 11, 0.18);
}
.wisdom-row:first-of-type { border-top: none; padding-top: 0; }
.wisdom-row-label {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--gold-strong);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  align-self: flex-start;
  padding-top: var(--space-px);
}
.wisdom-row-text {
  font-size: var(--text-sm);
  color: var(--ink);
  line-height: 1.55;
}

/* === M90 STRATEGIC INSIGHT — Tarjeta dorada premium === */
.m90-strategic-card {
  margin: var(--space-4) 0;
  padding: var(--space-5) var(--space-5) var(--space-5);
  background: linear-gradient(155deg, #1e1b4b 0%, #312e81 50%, #1e1b4b 100%);
  border: 1px solid rgba(245, 158, 11, 0.4);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-glow-gold);
  position: relative;
  overflow: hidden;
  color: #fef3c7;
}
.m90-strategic-shimmer-bar {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--space-0);
  background: linear-gradient(90deg, transparent, var(--gold), #fbbf24, var(--gold), transparent);
  background-size: 200% 100%;
  animation: m90-shimmer 3s linear infinite;
}
@keyframes m90-shimmer {
  0% { background-position: -100% 0; }
  100% { background-position: 200% 0; }
}
.m90-strategic-head { margin-bottom: var(--space-3); }
.m90-strategic-badge {
  display: inline-block;
  font-size: var(--text-xs);
  font-weight: var(--weight-black);
  color: #fbbf24;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  padding: var(--space-0) var(--space-2h);
  background: rgba(245, 158, 11, 0.15);
  border: 1px solid rgba(245, 158, 11, 0.35);
  border-radius: var(--radius-pill);
}
.m90-strategic-title {
  font-size: var(--text-xl);
  font-weight: var(--weight-bold);
  color: #fff;
  margin-bottom: var(--space-3);
  letter-spacing: -0.01em;
}
.m90-strategic-body {
  font-size: var(--text-md);
  color: #e0e7ff;
  line-height: 1.65;
}

/* ═══════════════════════════════════════════
   STRATEGIC REVIEW CARD — M90 Premium (Days 45/60/75)
   $1,500 feature — visually distinct, indigo-gold premium
   ═══════════════════════════════════════════ */
.strategic-review-card {
  position: relative;
  margin: var(--space-5) 0;
  padding: var(--space-6) var(--space-5) var(--space-5);
  background: linear-gradient(155deg, #0f0a2e 0%, #1e1b4b 35%, #312e81 70%, #1e1b4b 100%);
  border: 1.5px solid rgba(245, 158, 11, 0.45);
  border-radius: var(--radius-xl);
  box-shadow: 0 4px 24px rgba(99, 102, 241, 0.15), 0 0 40px rgba(245, 158, 11, 0.08), var(--shadow-glow-gold);
  color: #e0e7ff;
  overflow: hidden;
}
.sr-shimmer-bar {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: var(--space-0);
  background: linear-gradient(90deg, transparent, #fbbf24, #f59e0b, #fbbf24, transparent);
  background-size: 200% 100%;
  animation: m90-shimmer 3s linear infinite;
}
.sr-header {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
  flex-wrap: wrap;
}
.sr-badge {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #fbbf24;
  background: rgba(245, 158, 11, 0.15);
  border: 1px solid rgba(245, 158, 11, 0.35);
  border-radius: var(--radius-pill);
  padding: var(--space-0) var(--space-3);
}
.sr-period {
  font-size: var(--text-xs);
  color: #a5b4fc;
  font-weight: 600;
}
.sr-title {
  font-size: var(--text-xl);
  font-weight: 800;
  color: #fff;
  margin: 0 0 var(--space-4);
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.sr-executive-summary {
  font-size: var(--text-md);
  color: #c7d2fe;
  line-height: 1.7;
  margin-bottom: var(--space-4);
  padding: var(--space-4);
  background: rgba(255, 255, 255, 0.04);
  border-radius: var(--radius-md);
  border-left: 3px solid #818cf8;
}
.sr-insight-box {
  margin-bottom: var(--space-4);
  padding: var(--space-4);
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.12) 0%, rgba(251, 191, 36, 0.06) 100%);
  border: 1px solid rgba(245, 158, 11, 0.3);
  border-radius: var(--radius-md);
}
.sr-insight-label {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #fbbf24;
  margin-bottom: var(--space-2);
}
.sr-insight-text {
  font-size: var(--text-base);
  color: #fef3c7;
  line-height: 1.6;
  font-weight: 500;
}
.sr-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
}
@media (max-width: 640px) {
  .sr-columns { grid-template-columns: 1fr; }
}
.sr-col {
  padding: var(--space-3);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.03);
}
.sr-col-worked {
  border-left: 3px solid #10b981;
}
.sr-col-failed {
  border-left: 3px solid #ef4444;
}
.sr-col-label {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: var(--space-2);
}
.sr-col-worked .sr-col-label { color: #34d399; }
.sr-col-failed .sr-col-label { color: #f87171; }
.sr-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.sr-list-item {
  font-size: var(--text-body);
  line-height: 1.6;
  padding: 3px 0;
  color: #e0e7ff;
}
.sr-list-icon { margin-right: var(--space-1); font-weight: 700; }
.sr-list-success .sr-list-icon { color: #34d399; }
.sr-list-fail .sr-list-icon { color: #f87171; }
.sr-list-empty { color: #64748b; font-style: italic; }
.sr-recommendation {
  margin-bottom: var(--space-4);
  padding: var(--space-4);
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.15) 0%, rgba(79, 70, 229, 0.08) 100%);
  border: 1px solid rgba(129, 140, 248, 0.3);
  border-radius: var(--radius-md);
}
.sr-recommendation-label {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #a5b4fc;
  margin-bottom: var(--space-2);
}
.sr-recommendation-text {
  font-size: var(--text-base);
  color: #fff;
  line-height: 1.65;
  font-weight: 500;
}
.sr-focus {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: rgba(16, 185, 129, 0.08);
  border: 1px solid rgba(16, 185, 129, 0.25);
  border-radius: var(--radius-md);
}
.sr-focus-icon {
  color: #34d399;
  font-size: var(--text-lg);
  margin-top: var(--space-px);
  flex-shrink: 0;
}
.sr-focus-label {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #34d399;
  margin-bottom: var(--space-px);
}
.sr-focus-text {
  font-size: var(--text-base);
  color: #d1fae5;
  line-height: 1.55;
}
.sr-risk {
  margin-bottom: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: rgba(239, 68, 68, 0.08);
  border: 1px solid rgba(239, 68, 68, 0.25);
  border-left: 3px solid #ef4444;
  border-radius: var(--radius-md);
}
.sr-risk-label {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #fca5a5;
  margin-bottom: var(--space-1);
}
.sr-risk-text {
  font-size: var(--text-body);
  color: #fee2e2;
  line-height: 1.55;
}
.sr-benchmark {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute-dark);
  font-style: italic;
  padding-top: var(--space-2);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

/* ═══════════════════════════════════════════
   STRATEGIC REVIEW — Interactive (Palanca 3)
   Preguntas duras, escenarios, submit
   ═══════════════════════════════════════════ */
.sr-severity {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 4px;
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.5px;
  margin-left: 8px;
}
.sr-severity-critical {
  background: #991b1b;
  color: #fee2e2;
  animation: pulse-critical 2s ease-in-out infinite;
}
.sr-severity-high {
  background: #92400e;
  color: #fef3c7;
}
.sr-severity-medium {
  /* Jerarquia visual: critical (rojo) > high (ambar) > medium (indigo).
     Indigo comunica "importante, no urgente" y se diferencia claramente
     de los dos niveles superiores. Contraste >12:1 (AAA). */
  background: #1e3a8a;
  color: #dbeafe;
}
/* audit 2026-05-04 cierre: milestone = celebracion positiva (no crisis).
   Verde gradient con sombra para distinguir visualmente de severidades de problema. */
.sr-severity-milestone {
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
  color: white;
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.40);
}
@keyframes pulse-critical {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.65; }
}

.sr-questions-section,
.sr-scenarios-section {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.sr-section-header {
  font-size: var(--text-sm);
  font-weight: 700;
  color: #fbbf24;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 12px;
}
.sr-question {
  margin-bottom: 14px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.04);
  border-radius: 6px;
  border-left: 3px solid #6366f1;
}
.sr-question-text {
  color: #e0e7ff;
  font-weight: 600;
  margin-bottom: 4px;
  font-size: var(--text-sm);
}
.sr-question-why {
  font-size: var(--text-xs);
  color: #c7d2fe;
  font-style: italic;
  margin-bottom: 8px;
}
.sr-question-answer {
  width: 100%;
  background: rgba(15, 10, 46, 0.6);
  color: #e0e7ff;
  border: 1px solid rgba(99, 102, 241, 0.3);
  border-radius: 4px;
  padding: 6px 8px;
  font-size: var(--text-xs-plus);
  resize: vertical;
  margin-top: 6px;
}
.sr-question-answer:focus {
  outline: none;
  border-color: #fbbf24;
  box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.18);
  transition: border-color var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out);
}

.sr-system-reco {
  background: rgba(251, 191, 36, 0.08);
  border: 1px solid rgba(251, 191, 36, 0.25);
  padding: 10px 14px;
  border-radius: 6px;
  margin-bottom: 14px;
  font-size: var(--text-sm);
  color: #fef3c7;
}
.sr-system-reason {
  font-size: var(--text-xs-plus);
  margin-top: 4px;
  color: #e0e7ff;
}
.sr-scenarios-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.sr-scenario-card {
  display: block;
  padding: 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1.5px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.sr-scenario-card:hover {
  border-color: rgba(99, 102, 241, 0.5);
  background: rgba(99, 102, 241, 0.08);
}
.sr-scenario-card input[type="radio"] {
  display: none;
}
.sr-scenario-card input[type="radio"]:checked ~ .sr-scenario-header {
  color: #fbbf24;
}
.sr-scenario-card:has(input[type="radio"]:checked) {
  border-color: #fbbf24;
  background: rgba(251, 191, 36, 0.08);
}
.sr-scenario-recommended {
  position: relative;
}
.sr-scenario-recommended::before {
  content: "★";
  position: absolute;
  top: -8px;
  right: -8px;
  color: #fbbf24;
  font-size: 18px;
}
.sr-scenario-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
.sr-scenario-label {
  font-weight: 700;
  color: #e0e7ff;
  font-size: var(--text-sm);
}
.sr-scenario-prob {
  font-size: var(--text-xs);
  color: #a5b4fc;
  background: rgba(99, 102, 241, 0.15);
  padding: 2px 8px;
  border-radius: 10px;
}
.sr-scenario-desc {
  font-size: var(--text-xs-plus);
  color: #c7d2fe;
  margin-bottom: 6px;
}
.sr-scenario-conditions {
  font-size: var(--text-xs);
  color: #a5b4fc;
  margin-bottom: 6px;
}
.sr-scenario-plan {
  font-size: var(--text-xs);
  margin-top: 6px;
}
.sr-scenario-plan summary {
  cursor: pointer;
  color: #fbbf24;
  font-weight: 600;
}
.sr-scenario-plan ul {
  margin: 6px 0 0 18px;
  color: #c7d2fe;
}
.sr-pivot-detail {
  margin-top: 8px;
  padding: 8px;
  background: rgba(239, 68, 68, 0.1);
  border-left: 2px solid #ef4444;
  font-size: var(--text-xs-plus);
  color: #fecaca;
  border-radius: 4px;
}

.sr-submit-section {
  margin-top: 14px;
}
.sr-user-note {
  width: 100%;
  background: rgba(15, 10, 46, 0.6);
  color: #e0e7ff;
  border: 1px solid rgba(99, 102, 241, 0.3);
  border-radius: 4px;
  padding: 8px 10px;
  font-size: var(--text-xs-plus);
  resize: vertical;
  margin-bottom: 10px;
}
.sr-submit-btn {
  width: 100%;
  padding: 12px;
  background: linear-gradient(90deg, #fbbf24, #f59e0b);
  color: #1e1b4b;
  border: none;
  border-radius: 6px;
  font-weight: 700;
  font-size: var(--text-sm);
  cursor: pointer;
  transition: all 0.2s ease;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.sr-submit-btn:hover:not(:disabled) {
  background: linear-gradient(90deg, #f59e0b, #d97706);
  transform: translateY(-1px);
}
.sr-submit-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.sr-decision-taken {
  margin-top: 14px;
  padding: 10px 14px;
  background: rgba(16, 185, 129, 0.1);
  border: 1px solid rgba(16, 185, 129, 0.3);
  border-radius: 6px;
  color: #d1fae5;
  font-size: var(--text-sm);
}
.sr-decision-note {
  font-size: var(--text-xs-plus);
  margin-top: 4px;
  font-style: italic;
  color: #a7f3d0;
}

/* ═══════════════════════════════════════════
   STRATEGIC DEEP DIVE — M90 Premium (Day 8+)
   Collapsible section below strategic insight
   ═══════════════════════════════════════════ */
.m90-deep-dive {
  margin: var(--space-3) 0 var(--space-4);
  background: linear-gradient(155deg, rgba(30, 27, 75, 0.6) 0%, rgba(49, 46, 129, 0.4) 100%);
  border: 1px solid rgba(129, 140, 248, 0.25);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: box-shadow var(--t-base) var(--ease-out);
}
.m90-deep-dive:hover {
  box-shadow: 0 2px 16px rgba(99, 102, 241, 0.12);
}
.m90-deep-dive-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-4);
  cursor: pointer;
  user-select: none;
  background: rgba(255, 255, 255, 0.03);
  transition: background var(--t-fast) var(--ease-out);
}
.m90-deep-dive-toggle:hover {
  background: rgba(255, 255, 255, 0.06);
}
.m90-deep-dive-badge {
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #a5b4fc;
}
.m90-deep-dive .toggle-icon {
  color: #818cf8;
  font-size: var(--text-xs-plus);
  transition: transform var(--t-base) var(--ease-out);
}
.m90-deep-dive:not(.collapsed) .toggle-icon {
  transform: rotate(90deg);
}
.m90-deep-dive-body {
  padding: 0 var(--space-4) var(--space-4);
}
.m90-deep-dive.collapsed .m90-deep-dive-body {
  display: none;
}
.m90-dd-section {
  padding: var(--space-3) 0;
  border-bottom: 1px solid rgba(129, 140, 248, 0.1);
}
.m90-dd-section:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.m90-dd-label {
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #c4b5fd;
  margin-bottom: var(--space-1);
}
.m90-dd-text {
  font-size: var(--text-body);
  color: #e0e7ff;
  line-height: 1.6;
}

/* === EVIDENCE CONTRACT HERO === */
.ec-hero {
  margin: var(--space-3) 0 var(--space-4);
  padding: var(--space-4);
  background: linear-gradient(160deg, rgba(15, 157, 116, 0.04) 0%, rgba(37, 99, 235, 0.04) 100%);
  border: 1.5px solid rgba(15, 157, 116, 0.22);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}
.ec-hero-head {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
  padding-bottom: var(--space-3);
  border-bottom: 1px dashed rgba(15, 157, 116, 0.2);
}
.ec-hero-icon { font-size: var(--text-xl); }
.ec-hero-titles { flex: 1; }
.ec-hero-title {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--success);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.ec-hero-mission {
  font-size: var(--text-sm);
  color: var(--ink);
  font-weight: var(--weight-semi);
  margin-top: var(--space-px);
}
.ec-hero-count {
  font-size: var(--text-md);
  font-weight: var(--weight-bold);
  color: var(--ink-soft);
  background: #fff;
  padding: var(--space-0) var(--space-2h);
  border-radius: var(--radius-pill);
  border: 1px solid var(--line);
}
.ec-hero-count-num {
  color: var(--success);
  font-weight: var(--weight-black);
}
.ec-hero-rule {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  margin-bottom: var(--space-3);
  background: rgba(15, 157, 116, 0.06);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  color: var(--ink-soft);
  font-style: italic;
}
.ec-hero-fields {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
/* E3 (2026-06-11): disclosure progresivo del contrato de evidencia. */
.ec-hero-fields-more {
  margin-top: var(--space-3);
}
.ec-more-toggle {
  margin-top: var(--space-3);
  align-self: flex-start;
  background: rgba(15, 157, 116, 0.08);
  color: var(--brand, #0f9d74);
  border: 1px dashed rgba(15, 157, 116, 0.4);
  border-radius: var(--radius-md);
  padding: 8px 14px;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.ec-more-toggle:hover {
  background: rgba(15, 157, 116, 0.14);
  border-color: rgba(15, 157, 116, 0.6);
}
.ec-field {
  padding: var(--space-3);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  transition: border-color var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out);
}
.ec-field:hover { border-color: rgba(15, 157, 116, 0.3); }
.ec-field-filled {
  border-color: var(--success);
  background: rgba(15, 157, 116, 0.04);
  box-shadow: 0 0 0 1px rgba(15, 157, 116, 0.18);
}
.ec-field-label {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  font-weight: var(--weight-semi);
  color: var(--ink);
  margin-bottom: var(--space-1);
}
.ec-field-check {
  display: inline-block;
  width: var(--space-4);
  height: var(--space-4);
  text-align: center;
  font-size: var(--text-md);
  color: var(--success);
  line-height: 1;
  transition: transform var(--t-base) var(--ease-spring);
}
.ec-field-filled .ec-field-check { transform: scale(1.2); }
.ec-field-hint {
  font-size: var(--text-xs);
  color: var(--ink-mute);
  margin: 0 0 var(--space-2) 26px;
}
.ec-field-input {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  font-family: inherit;
  color: var(--ink);
  background: #fff;
  resize: vertical;
  transition: border-color var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out);
}
.ec-field-input:focus {
  outline: none;
  border-color: var(--success);
  box-shadow: 0 0 0 3px rgba(15, 157, 116, 0.15);
}

/* === HISTORY TIMELINE PREMIUM === */
.history-timeline-summary {
  margin-bottom: var(--space-5);
  padding: var(--space-4);
  background: linear-gradient(160deg, #fff 0%, var(--primary-soft) 100%);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
}
.hts-progress-phrase {
  font-size: var(--text-sm);
  font-weight: var(--weight-semi);
  color: var(--ink-soft);
  text-align: center;
  margin-bottom: var(--space-3);
  padding-bottom: var(--space-3);
  border-bottom: 1px dashed var(--line);
}
.hts-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-3);
}
.hts-stat {
  text-align: center;
  padding: var(--space-2);
}
.hts-stat-num {
  font-size: var(--text-2xl);
  font-weight: var(--weight-black);
  color: var(--ink);
  line-height: 1;
}
.hts-stat-m .hts-stat-num { color: var(--primary); }
.hts-stat-l .hts-stat-num { color: var(--gold-strong); }
.hts-stat-v .hts-stat-num { color: var(--success); }
.hts-stat-label {
  font-size: var(--text-xs);
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-top: var(--space-1);
}
.history-timeline {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}
.history-phase-band {
  position: relative;
}
.history-phase-band-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  background: linear-gradient(90deg, var(--primary-soft), transparent);
  border-left: 3px solid var(--primary);
  border-radius: var(--radius-sm);
  margin-bottom: var(--space-3);
}
.history-phase-band.history-phase-F1 .history-phase-band-head { border-left-color: var(--phase-F1); }
.history-phase-band.history-phase-F2 .history-phase-band-head { border-left-color: var(--phase-F2); }
.history-phase-band.history-phase-F3 .history-phase-band-head { border-left-color: var(--phase-F3); }
.history-phase-band.history-phase-F4 .history-phase-band-head { border-left-color: var(--phase-F4); }
.history-phase-band.history-phase-F5 .history-phase-band-head { border-left-color: var(--phase-F5); }
.history-phase-band.history-phase-F6 .history-phase-band-head { border-left-color: var(--phase-F6); }
.history-phase-band.history-phase-F7 .history-phase-band-head { border-left-color: var(--phase-F7); }
.history-phase-band.history-phase-F8 .history-phase-band-head { border-left-color: var(--phase-F8); }
.history-phase-band.history-phase-F9 .history-phase-band-head { border-left-color: var(--phase-F9); }
.history-phase-icon { font-size: var(--text-md); }
.history-phase-id {
  font-size: var(--text-xs);
  font-weight: var(--weight-black);
  color: var(--primary-strong);
  background: #fff;
  padding: var(--space-px) var(--space-1h);
  border-radius: var(--radius-pill);
  border: 1px solid var(--line);
}
.history-phase-name {
  font-size: var(--text-sm);
  font-weight: var(--weight-semi);
  color: var(--ink);
  flex: 1;
}
.history-phase-range {
  font-size: var(--text-xs);
  color: var(--ink-mute);
}
.history-phase-band-body {
  display: flex;
  flex-direction: column;
}
.tl-node {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: var(--space-3);
  position: relative;
}
.tl-node-axis {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.tl-node-bullet {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #fff;
  border: var(--space-px) solid var(--line);
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
  color: var(--ink-mute);
  z-index: var(--z-above);
  flex-shrink: 0;
  transition: transform var(--t-base) var(--ease-spring), box-shadow var(--t-base) var(--ease-out);
}
.tl-node-completed .tl-node-bullet {
  background: var(--success);
  border-color: var(--success);
  color: #fff;
  box-shadow: 0 0 0 4px rgba(15, 157, 116, 0.12);
}
.tl-node-skipped .tl-node-bullet {
  background: var(--warning);
  border-color: var(--warning);
  color: #fff;
}
.tl-node-debt .tl-node-bullet {
  background: var(--danger);
  border-color: var(--danger);
  color: #fff;
}
.tl-node-line {
  width: var(--space-px);
  flex: 1;
  background: linear-gradient(180deg, var(--line), transparent);
  margin-top: var(--space-px);
}
.tl-node:last-child .tl-node-line { display: none; }
.tl-node-card {
  margin-bottom: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  transition: transform var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out), border-color var(--t-base) var(--ease-out);
}
.tl-node-card:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
  border-color: rgba(37, 99, 235, 0.25);
}
.tl-node-completed .tl-node-card {
  border-left: 3px solid var(--success);
}
.tl-node-skipped .tl-node-card {
  border-left: 3px solid var(--warning);
  opacity: 0.78;
}
.tl-node-debt .tl-node-card { border-left: 3px solid var(--danger); }
.tl-node-pending .tl-node-card { opacity: 0.55; }
.tl-node-head {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
}
.tl-node-day {
  display: flex;
  align-items: baseline;
  gap: var(--space-0);
}
.tl-node-day-label {
  font-size: var(--text-xs);
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.tl-node-day-num {
  font-size: var(--text-lg);
  font-weight: var(--weight-black);
  color: var(--ink);
}
.tl-node-metrics {
  display: flex;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-family: "SF Mono", "Consolas", monospace;
}
.tl-metric {
  padding: var(--space-px) var(--space-1h);
  border-radius: var(--radius-pill);
  font-weight: var(--weight-bold);
}
.tl-metric-m { background: rgba(37, 99, 235, 0.12); color: var(--primary-strong); }
.tl-metric-l { background: rgba(245, 158, 11, 0.14); color: var(--gold-strong); }
.tl-metric-v { background: rgba(15, 157, 116, 0.14); color: var(--success); }
.tl-node-score {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--ink-mute);
  margin-left: auto;
}
.tl-node-expand {
  font-size: var(--text-md);
  color: var(--ink-mute);
  transition: transform var(--t-base) var(--ease-out);
}
.tl-node-expand.expanded { transform: rotate(180deg); }
.tl-node-odd {
  margin-top: var(--space-2);
  font-size: var(--text-sm);
  color: var(--ink);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.tl-node-pattern {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-2);
  padding: var(--space-1) var(--space-2);
  background: var(--info-soft);
  border-radius: var(--radius-sm);
  font-size: var(--text-xs);
  color: var(--primary-strong);
}
.tl-pattern-icon { flex-shrink: 0; }
.tl-node-detail {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px dashed var(--line);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.tl-node-detail.hidden { display: none; }
.tl-detail-row {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: var(--space-3);
  font-size: var(--text-sm);
  align-items: start;
}
.tl-detail-label {
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding-top: var(--space-px);
}
.tl-detail-text {
  color: var(--ink);
  line-height: 1.55;
}
.tl-detail-meta {
  color: var(--ink-mute);
  font-size: var(--text-xs);
}

/* === C16: ARMONIZAR componentes nuevos con tema indigo-gold legacy de M90 ===
 * NOTA: El tema "indigo-gold gradient" de .tier-momentum es decisión documentada
 * en CLAUDE.md (paleta premium intencional). NO se reconcilia hacia claro — al
 * contrario, se asegura que los nuevos componentes premium (mentor-reasoning,
 * hypothesis, wisdom-card) hereden la estética indigo-gold cuando están en M90.
 */
.tier-momentum .mentor-reasoning-premium {
  background: linear-gradient(135deg, rgba(79, 70, 229, 0.10) 0%, rgba(245, 158, 11, 0.06) 100%);
  border-left-color: var(--indigo);
}
.tier-momentum .mentor-reasoning-title { color: var(--indigo); }
.tier-momentum .hypothesis-premium {
  background: linear-gradient(135deg, #ffffff 0%, rgba(79, 70, 229, 0.05) 100%);
  border-color: rgba(79, 70, 229, 0.25);
}
.tier-momentum .hypothesis-pulse { background: var(--indigo); box-shadow: 0 0 0 0 rgba(79, 70, 229, 0.6); }
.tier-momentum .hypothesis-label { color: var(--indigo-strong); }
.tier-momentum .wisdom-card {
  background: linear-gradient(160deg, #ffffff 0%, rgba(79, 70, 229, 0.04) 50%, rgba(245, 158, 11, 0.04) 100%);
  border-color: rgba(79, 70, 229, 0.18);
}
.tier-momentum .wisdom-title { color: var(--indigo-strong); }
.tier-momentum .wisdom-row-label { color: var(--indigo-strong); }

/* === C17: MICROINTERACCIONES GLOBALES === */
.task,
.plan-section,
.business-snapshot,
.bsnap-item {
  transition: transform var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out), border-color var(--t-base) var(--ease-out);
}
.task:hover {
  transform: translateX(2px);
}
.phase-badge,
.policy-badge {
  transition: transform var(--t-base) var(--ease-spring), box-shadow var(--t-base) var(--ease-out);
}
.phase-badge:hover,
.policy-badge:hover {
  transform: translateY(-1px) scale(1.02);
  box-shadow: var(--shadow-sm);
}
button {
  position: relative;
  overflow: hidden;
}
button:active:not(:disabled) {
  transform: translateY(1px);
}

/* === C18: CHECKBOX TASK CONFIRMATION === */
.task-check {
  appearance: none;
  -webkit-appearance: none;
  width: var(--space-4h);
  height: var(--space-4h);
  border: var(--space-px) solid var(--line);
  border-radius: var(--radius-sm);
  background: #fff;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
  transition: all var(--t-base) var(--ease-spring);
}
.task-check:hover { border-color: var(--primary); }
.task-check:checked {
  background: var(--success);
  background-image: none; /* override del SVG legacy en línea 5028 */
  border-color: var(--success);
  transform: scale(1.06);
  box-shadow: 0 0 0 4px rgba(15, 157, 116, 0.18);
}
.task-check:checked::after {
  content: "✓";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: var(--text-body);
  font-weight: var(--weight-black);
  animation: check-pop var(--t-slow) var(--ease-spring);
}
@keyframes check-pop {
  0% { transform: scale(0); opacity: 0; }
  60% { transform: scale(1.4); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

/* === C20: MOBILE BREAKPOINTS === */
@media (max-width: 768px) {
  .hts-stats-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-2);
  }
  .mr-line,
  .wisdom-row,
  .tl-detail-row {
    grid-template-columns: 1fr;
    gap: var(--space-1);
  }
  .mr-tag,
  .wisdom-row-label,
  .tl-detail-label {
    align-self: flex-start;
  }
  .ec-hero-head {
    flex-wrap: wrap;
  }
  .ec-hero-count {
    margin-left: auto;
  }
  /* Bloque D audit 2026-05-18: M90 Strategic State panel responsive. */
  .momentum-strategic-state-panel .mss-inner {
    padding: 0.85rem 0.9rem !important;
  }
  .momentum-strategic-state-panel .mss-row {
    padding: 0.5rem 0.65rem !important;
  }
  .momentum-strategic-state-panel .mss-compounding > div:last-child {
    grid-template-columns: 1fr 1fr !important;
  }
  .momentum-strategic-state-panel .mss-fos {
    padding: 0.55rem 0.7rem !important;
  }
  .momentum-strategic-state-panel .mss-badges {
    flex-direction: row !important;
    width: 100%;
  }
}
@media (max-width: 480px) {
  .momentum-strategic-state-panel .mss-compounding > div:last-child {
    grid-template-columns: 1fr !important;
  }
  .momentum-strategic-state-panel .mss-header {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}
@media (max-width: 420px) {
  .hypothesis-question { font-size: var(--text-sm); }
  .m90-strategic-title { font-size: var(--text-lg); }
  .tl-node {
    grid-template-columns: 28px 1fr;
    gap: var(--space-2);
  }
  .tl-node-bullet {
    width: var(--space-5);
    height: var(--space-5);
    font-size: var(--text-xs);
  }
  .tl-node-card {
    padding: var(--space-3);
  }
  .tl-node-day-num {
    font-size: var(--text-md);
  }
}

/* === C19: PLAN RECOVERY CARD (clases en vez de inline gradients) === */
.plan-recovery-card {
  margin: var(--space-5) auto;
  max-width: 520px;
  padding: var(--space-6) var(--space-5);
  text-align: center;
  background: linear-gradient(135deg, #0f0a2e 0%, #1e1b4b 50%, #312e81 100%);
  border: 1px solid rgba(167, 139, 250, 0.35);
  border-radius: var(--radius-xl);
  color: #ffffff;
  box-shadow: var(--shadow-glow-indigo);
}
.prc-icon {
  font-size: 2.4rem;
  margin-bottom: var(--space-2);
  line-height: 1;
}
.prc-title {
  margin: 0 0 var(--space-2);
  font-size: var(--text-xl);
  font-weight: var(--weight-black);
  background: linear-gradient(135deg, #ffffff 0%, var(--gold) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.prc-sub {
  margin: 0 0 var(--space-3);
  font-size: var(--text-sm);
  color: #c7d2fe;
  line-height: 1.5;
}
.prc-safe {
  margin: 0 0 var(--space-5);
  padding: var(--space-3) var(--space-4);
  background: var(--gold-soft);
  border: 1px solid rgba(245, 158, 11, 0.25);
  border-radius: var(--radius-md);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-sm);
  color: #fde68a;
  font-weight: var(--weight-semi);
}
.prc-actions {
  display: flex;
  gap: var(--space-3);
  justify-content: center;
  flex-wrap: wrap;
}
.prc-btn-regen {
  background: linear-gradient(135deg, #fbbf24 0%, var(--gold) 100%);
  color: #1e1b4b;
  border: none;
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-md);
  font-weight: var(--weight-black);
  font-size: var(--text-sm);
  cursor: pointer;
  letter-spacing: 0.04em;
  transition: transform var(--t-base) var(--ease-out), box-shadow var(--t-base) var(--ease-out);
}
.prc-btn-regen:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-glow-gold);
}
.prc-btn-reload {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  border: 1.5px solid rgba(167, 139, 250, 0.4);
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-md);
  font-weight: var(--weight-bold);
  font-size: var(--text-sm);
  cursor: pointer;
  letter-spacing: 0.04em;
  transition: background var(--t-base) var(--ease-out);
}
.prc-btn-reload:hover {
  background: rgba(255, 255, 255, 0.14);
}

/* === E24: WIZARD TIP PREMIUM === */
.wizard-tip {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin: var(--space-3) 0 var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.08) 0%, rgba(37, 99, 235, 0.05) 100%);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  color: var(--ink);
  line-height: 1.55;
  box-shadow: var(--shadow-sm);
}
.wizard-tip-icon {
  font-size: var(--text-md);
  flex-shrink: 0;
  filter: drop-shadow(0 1px 2px rgba(245, 158, 11, 0.4));
}
.wizard-tip-text { flex: 1; }
.wizard-tip-enter {
  animation: wizard-tip-slide var(--t-slow) var(--ease-out);
}
@keyframes wizard-tip-slide {
  0% {
    opacity: 0;
    transform: translateY(-6px) scale(0.98);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* ════════════════════════════════════════════════════════════════════════
   🎨 LIMPIEZA VISUAL DÍA 1 — modo `day1-compact`
   ────────────────────────────────────────────────────────────────────────
   Problema previo: la pantalla del día 1 tenía 15+ bloques apilados
   (header, compromiso, diagnostic, case, roadmap, revenue tracker,
   primer contacto, escalation, unit economics, plan_ideal, ODD, tasks,
   extended, overachiever...). En desktop quedaba angosta y vacía;
   en móvil era una montaña interminable.

   Fix: por defecto, sólo lo esencial visible:
     1. Header compacto
     2. Compromiso (cuando viene)
     3. Mentor reasoning ("Por qué este plan hoy")
     4. Hipótesis bajo prueba
     5. ODD ("Tu objetivo de hoy")
     6. TMC priority tasks
     7. Botón "Ver detalle completo" → revela TODOS los [data-d1-extra]

   El JS marca con [data-d1-extra="1"] los bloques secundarios. La regla
   abajo los oculta hasta que el wrapper recibe `.day1-show-extras`.
   ════════════════════════════════════════════════════════════════════════ */

/* Ocultar secundarios por defecto en día 1 compacto */
.day1-premium-wrapper.day1-compact [data-d1-extra="1"] {
  display: none !important;
}
.day1-premium-wrapper.day1-compact.day1-show-extras [data-d1-extra="1"] {
  display: block !important;
  animation: premiumFadeUp 0.35s ease;
}

/* Header más respirado, menos pomposo */
.day1-premium-wrapper.day1-compact .day1-header {
  padding: var(--space-4) var(--space-4h) var(--space-3) !important;
}
.day1-premium-wrapper.day1-compact .day1-header::before {
  display: none !important;  /* matar shimmer ruidoso */
}
.day1-premium-wrapper.day1-compact .day1-title {
  font-size: 1.35rem !important;
  margin-bottom: var(--space-0) !important;
}
.day1-premium-wrapper.day1-compact .day1-subtitle {
  font-size: var(--text-body) !important;
  opacity: 0.85;
}
.day1-premium-wrapper.day1-compact .day1-badge {
  margin-bottom: var(--space-1h) !important;
  font-size: 0.65rem !important;
  padding: 5px 14px !important;
}

/* Tighter section padding y margin */
.day1-premium-wrapper.day1-compact .day1-section {
  margin: var(--space-2) 0 !important;
  padding: var(--space-3) var(--space-3h) !important;
}
.day1-premium-wrapper.day1-compact .day1-section-title {
  font-size: 0.66rem !important;
  margin-bottom: var(--space-1) !important;
}
.day1-premium-wrapper.day1-compact .day1-section-body {
  font-size: var(--text-base) !important;
  line-height: 1.55 !important;
}

/* Card interior con mejor relleno desktop (antes quedaba angosta) */
.day1-premium-wrapper.day1-compact .plan-card {
  padding: var(--space-4) 22px !important;
}
@media (min-width: 1024px) {
  .day1-premium-wrapper.day1-compact .plan-card {
    padding: 22px 28px !important;
  }
}

/* Botón "Ver detalle completo" — llamado discreto, no pomposo */
.day1-extras-toggle {
  display: block;
  margin: var(--space-2h) auto var(--space-1);
  padding: 9px 18px;
  background: rgba(99, 102, 241, 0.06);
  color: #4c1d95;
  border: 1px dashed rgba(99, 102, 241, 0.30);
  border-radius: 999px;
  font-size: var(--text-xs-plus);
  font-weight: 600;
  letter-spacing: 0.02em;
  cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease;
}
.day1-extras-toggle:hover {
  background: rgba(99, 102, 241, 0.12);
  border-color: rgba(99, 102, 241, 0.55);
}
.day1-premium-wrapper.day1-show-extras .day1-extras-toggle {
  background: rgba(245, 158, 11, 0.08);
  border-color: rgba(245, 158, 11, 0.45);
  color: #92400e;
}

/* Mobile: padding más conservador */
@media (max-width: 640px) {
  .day1-premium-wrapper.day1-compact .day1-header {
    padding: var(--space-3) var(--space-3) var(--space-2) !important;
  }
  .day1-premium-wrapper.day1-compact .day1-title {
    font-size: var(--text-xl) !important;
  }
  .day1-premium-wrapper.day1-compact .plan-card {
    padding: var(--space-3) var(--space-3) !important;
  }
  .day1-premium-wrapper.day1-compact .day1-section {
    margin: var(--space-1h) 0 !important;
    padding: var(--space-2h) var(--space-3) !important;
  }
  .day1-extras-toggle {
    width: 100%;
    margin: var(--space-2) 0 var(--space-0);
  }
}

/* === REDUCE MOTION === */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================
 * TODAY ZONES — Flat layout (audit 2026-04-09)
 * ============================================================
 * Reduce el dashboard "Today" de ~14 contenedores anidados a 4
 * macrozonas tipograficas planas separadas por ritmo vertical de 32px.
 * Reglas duras:
 *   - Sin background propio en las zonas (heredan el del container)
 *   - Sin border ni border-radius por zona
 *   - Sin box-shadow por zona
 *   - El unico delimitador visual es el .zone-title (header en caps con
 *     hairline divider debajo)
 *   - Phase color: una sola variable --phase-color heredada que se usa
 *     en .task-num, en el accent del zone-title de Mision, etc.
 *
 * Toma precedencia sobre clases legacy via el orden de cascade
 * (este bloque va al final de styles.css). Las clases legacy
 * (.ayer-hoy-banner, .mentor-reasoning-premium, etc.) se aplanan
 * mas abajo en este mismo bloque.
 */
.today-zone {
  display: block;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.today-zone + .today-zone {
  margin-top: var(--zone-rhythm);
}
.zone-title {
  font-size: var(--text-xs-plus);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--zone-muted);
  margin: 0 0 16px 0;
  padding-bottom: var(--space-1h);
  border-bottom: 1px solid var(--zone-divider);
  display: flex;
  align-items: center;
  gap: var(--space-2);
}
.zone-title .zone-title-accent {
  color: var(--phase-color);
  font-weight: 900;
}
.zone-title .zone-title-day {
  color: var(--zone-muted);
  font-weight: 600;
  font-size: 0.78em;
  letter-spacing: 0;
}

/* Operations Center estado-dia (futuro tier operator): bloque plano */
.ops-day-status-block {
  margin-bottom: var(--space-2h);
  padding: var(--space-2) var(--space-2h);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-tint);
}
.ops-day-status-title {
  font-weight: 800;
  margin-bottom: var(--space-1);
  color: var(--ink);
}
.ops-day-status-text {
  font-size: var(--text-xs-plus);
  line-height: 1.35;
  color: var(--ink-soft);
}

/* Visually-hidden: oculta visualmente pero mantiene en el DOM (a11y/screenreader/JS compat) */
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.subzone-title {
  font-size: var(--text-body);
  font-weight: 700;
  color: var(--ink);
  margin: var(--space-4h) 0 8px 0;
  letter-spacing: -0.005em;
}
.subzone-title:first-child {
  margin-top: 0;
}
.zone-body {
  font-size: var(--text-base);
  line-height: 1.6;
  color: var(--ink);
}
.zone-body p {
  margin: 0 0 12px 0;
}
.zone-body p:last-child {
  margin-bottom: 0;
}
.zone-caption {
  font-size: var(--text-xs-plus);
  color: var(--zone-muted);
  font-weight: 500;
}
.zone-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-0) var(--space-2);
  font-size: var(--text-sm);
  color: var(--ink-soft);
  margin: var(--space-0) 0 var(--space-1h) 0;
}
.zone-chips .zone-chip {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-0);
}
.zone-chips .zone-chip + .zone-chip::before {
  content: "·";
  color: var(--zone-muted);
  margin-right: var(--space-1);
  font-weight: 700;
}

@media (max-width: 640px) {
  .today-zone + .today-zone {
    margin-top: var(--zone-rhythm-mobile);
  }
}

/* (Las variables --phase-color por fase se declaran en la regla canonica
 * de .plan-card.phase-FN en la seccion 1.5, alrededor de la linea 5245.
 * Aqui solo aplanamos el outer wrapper dentro de today-zone.) */

/* Aplanar el outer .plan-card cuando vive dentro de una today-zone:
 * sin background propio, sin border-radius, sin shadow, solo el
 * border-left de fase como senal sutil heredable. */
.today-zone .plan-card {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0;
  box-shadow: none;
}
.today-zone .plan-card.phase-F1,
.today-zone .plan-card.phase-F2,
.today-zone .plan-card.phase-F3,
.today-zone .plan-card.phase-F4,
.today-zone .plan-card.phase-F5,
.today-zone .plan-card.phase-F6,
.today-zone .plan-card.phase-F7,
.today-zone .plan-card.phase-F8,
.today-zone .plan-card.phase-F9 {
  border-left: 0;
}

/* SCORCHED-EARTH RESET (audit 2026-04-09):
 * Aplanar TODAS las clases legacy que viven dentro de today-zone .plan-card.
 * El renderPlanJson inyecta ~150 clases CSS distintas; en lugar de listar
 * cada una, neutralizamos backgrounds/borders/shadows en TODOS los <div>
 * descendientes del .plan-card dentro de la today-zone. Excepciones:
 *   - .day1-premium-wrapper .plan-card (día 1 tiene su propio look premium)
 *   - .task-script-text (codigo monoespaciado, mantiene fondo)
 *   - .compromiso-btn-firmar y otros botones (interactivos)
 *   - inputs, textareas, selects (forms)
 *   - mi nueva .ev-baseline-subcaption (vive en estadoVivoPanel, fuera de today-zone)
 *
 * Las clases legacy siguen DEFINIDAS y FUNCIONALES fuera de today-zone
 * (p.ej. en pantalla de Recovery o standalone), solo se aplanan dentro. */
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) div,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) section,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) article,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) aside,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) header,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) footer,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) span,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) ul,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) ol,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) li,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) pre,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) h1,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) h2,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) h3,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) h4,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) h5,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) h6,
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card) p {
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  border-width: 0 !important;
  box-shadow: none !important;
}

/* Restaurar elementos que SI deben tener look distinto */
.today-zone .plan-card .task-script-text,
.today-zone .plan-card pre {
  background: var(--surface-tint) !important;
  border: 1px solid var(--line-soft) !important;
  border-radius: 8px !important;
  padding: var(--space-2) var(--space-2h) !important;
  font-family: ui-monospace, "SF Mono", Monaco, monospace !important;
  font-size: var(--text-sm) !important;
  color: var(--ink) !important;
}

/* Buttons: respect their look */
.today-zone .plan-card button {
  background-color: initial;
  border-color: initial;
}

/* Aplanar margins de los wrappers grandes (day1-premium-wrapper excluido: tiene su
 * propio look premium con dark bg, border-radius y padding propios) */
.today-zone .plan-card:not(.day1-premium-wrapper .plan-card),
.today-zone .plan-tier,
.today-zone .plan-tier-action,
.today-zone .plan-tier-context,
.today-zone .plan-tier-deep {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
}

/* Border-left de fase para el wrapper outer dentro de today-zone: NO */
.today-zone .plan-card.phase-F1,
.today-zone .plan-card.phase-F2,
.today-zone .plan-card.phase-F3,
.today-zone .plan-card.phase-F4,
.today-zone .plan-card.phase-F5,
.today-zone .plan-card.phase-F6,
.today-zone .plan-card.phase-F7,
.today-zone .plan-card.phase-F8,
.today-zone .plan-card.phase-F9 {
  border-left: 0 !important;
}

/* Eliminar pseudo-elementos decorativos (shimmers, dots, pulses) */
.today-zone .plan-card *::before,
.today-zone .plan-card *::after,
.today-zone .ayer-hoy-banner::before,
.today-zone .mentor-reasoning-premium::before,
.today-zone .hypothesis-premium::before,
.today-zone .hypothesis-pulse,
.today-zone .m90-strategic-shimmer-bar {
  display: none !important;
  content: none !important;
}

/* Tipografia y colores legibles dentro de today-zone:
 * forzar var(--ink) y descendientes a inherit para que ningun color
 * pastel hardcoded se cuele desde clases legacy.
 * Aplica a TODOS los plan-card (incluyendo day1 cuyo plan-card es blanco). */
.today-zone .plan-card,
.today-zone .plan-card div,
.today-zone .plan-card span,
.today-zone .plan-card h1,
.today-zone .plan-card h2,
.today-zone .plan-card h3,
.today-zone .plan-card h4,
.today-zone .plan-card p,
.today-zone .plan-card li {
  color: var(--ink);
}
.today-zone .plan-card .sec-title,
.today-zone .plan-card .day1-section-title,
.today-zone .plan-card .mentor-reasoning-title,
.today-zone .plan-card .hypothesis-label,
.today-zone .plan-card .ayer-hoy-title,
.today-zone .plan-card .compromiso-badge,
.today-zone .plan-card .wisdom-title,
.today-zone .plan-card .deep-block-title {
  color: var(--ink) !important;
  font-weight: 700 !important;
  font-size: var(--text-body) !important;
  text-transform: none !important;
  letter-spacing: -0.005em !important;
  margin: var(--space-4) 0 var(--space-1) 0 !important;
}
.today-zone .plan-card .sec-body,
.today-zone .plan-card .day1-section-body,
.today-zone .plan-card .mentor-reasoning-body,
.today-zone .plan-card .hypothesis-question,
.today-zone .plan-card .ayer-hoy-body,
.today-zone .plan-card .compromiso-texto,
.today-zone .plan-card .wisdom-row-text {
  color: var(--ink) !important;
  font-size: var(--text-base) !important;
  line-height: 1.6 !important;
}
.today-zone .plan-card .day1-subtitle,
.today-zone .plan-card .ayer-hoy-icon,
.today-zone .plan-card .mr-tag,
.today-zone .plan-card .wisdom-row-label,
.today-zone .plan-card .compromiso-deadline,
.today-zone .plan-card .compromiso-consecuencia,
.today-zone .plan-card .task-meta,
.today-zone .plan-card .task-porque,
.today-zone .plan-card .plan-feedback span {
  color: var(--ink-soft) !important;
}

/* MR tags: pequenos pills tipograficos sin fondo, solo color */
.today-zone .plan-card .mr-tag {
  display: inline-block;
  font-size: 0.66rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 0 !important;
  margin-right: var(--space-1h);
  background: transparent !important;
}
.today-zone .plan-card .mr-tag-dato { color: var(--primary) !important; }
.today-zone .plan-card .mr-tag-diag { color: var(--warning) !important; }
.today-zone .plan-card .mr-tag-pres { color: var(--success) !important; }
.today-zone .plan-card .mr-line {
  display: block;
  margin: var(--space-1) 0;
}

/* Phase badge: pill plana sin gradient */
.today-zone .plan-card .phase-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-0);
  padding: var(--space-0) var(--space-2) !important;
  border-radius: 999px !important;
  background: rgba(11, 20, 48, 0.05) !important;
  color: var(--ink) !important;
  font-size: var(--text-xs-plus);
  font-weight: 700;
  border: 0 !important;
}

/* Tareas: estilo limpio */
.today-zone .plan-card .tasks {
  list-style: none;
  padding: 0;
  margin: var(--space-1h) 0 0 0;
}
.today-zone .plan-card .task-top {
  display: flex;
  gap: var(--space-2h);
  align-items: flex-start;
  padding: var(--space-2) 0;
}
.today-zone .plan-card .task-num {
  color: var(--phase-color) !important;
  font-weight: 900 !important;
  font-size: var(--text-xl) !important;
  letter-spacing: -0.03em;
  flex-shrink: 0;
  min-width: var(--space-5);
}
.today-zone .plan-card .task-accion {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--ink);
  line-height: 1.5;
}
.today-zone .plan-card .task-meta {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  margin-top: var(--space-px);
}
.today-zone .plan-card .task-tier-counter {
  font-size: var(--text-xs);
  color: var(--ink-mute);
  font-weight: 500;
  margin-left: var(--space-1h);
}

/* Metricas objetivo: chips inline planas */
.today-zone .plan-card .metrics-target-row {
  display: flex;
  gap: var(--space-4);
  flex-wrap: wrap;
  margin-top: var(--space-1);
}
.today-zone .plan-card .metric-target-item {
  display: flex;
  align-items: baseline;
  gap: var(--space-1);
}
.today-zone .plan-card .metric-target-num {
  font-size: var(--text-2xl);
  font-weight: 800;
  color: var(--phase-color) !important;
  letter-spacing: -0.02em;
}
.today-zone .plan-card .metric-target-label {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Toggles colapsables: ajustar estilo */
.today-zone .plan-card .plan-tier-toggle,
.today-zone .plan-card .task-tier-toggle,
.today-zone .plan-card .plan-ideal-toggle,
.today-zone .plan-card .day1-extras-toggle {
  cursor: pointer;
  padding: var(--space-2) 0 !important;
  border-top: 1px solid var(--zone-divider) !important;
  border-bottom: 0 !important;
  font-size: var(--text-sm) !important;
  font-weight: 600 !important;
  color: var(--ink-mute) !important;
  margin-top: var(--space-3h);
  display: flex;
  align-items: center;
  gap: var(--space-1h);
  background: transparent !important;
}
.today-zone .plan-card .day1-extras-toggle {
  background: transparent !important;
  border: 0 !important;
  text-align: left;
  width: 100%;
  text-transform: none !important;
  color: var(--primary) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Colapsable: ocultar contenido */
.today-zone .plan-card .plan-tier.collapsed .plan-tier-body,
.today-zone .plan-card .task-tier.collapsed .plan-tier-body,
.today-zone .plan-card .task-tier-ideal.collapsed .plan-ideal-body {
  display: none;
}

/* Plan feedback: sutil */
.today-zone .plan-card .plan-feedback {
  margin-top: var(--space-5);
  padding-top: var(--space-3);
  border-top: 1px solid var(--zone-divider);
  text-align: center;
  font-size: var(--text-xs-plus);
}
.today-zone .plan-card .plan-feedback .btn-feedback {
  background: transparent;
  border: 0;
  font-size: var(--text-lg);
  cursor: pointer;
  margin-left: var(--space-1);
  padding: var(--space-0) var(--space-1);
}

/* Compromiso card (Dia 1): mantenida pero plana */
.today-zone .plan-card .compromiso-card {
  background: transparent !important;
  border: 0 !important;
  border-left: 3px solid var(--phase-color) !important;
  padding: var(--space-1h) 0 var(--space-1h) var(--space-3) !important;
  margin: var(--space-3) 0 !important;
}
.today-zone .plan-card .compromiso-badge {
  font-size: 0.66rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  /* B11 FIX (audit 2026-06-02): el badge tiene FONDO de color propio (gradiente
     ámbar). Antes el texto usaba var(--phase-color); en F3/F4 ese color ES ámbar
     (#f59e0b) → texto ámbar sobre fondo ámbar = invisible. Texto oscuro fijo
     contrasta con el fondo ámbar y con el verde del estado "firmado". */
  color: #1f1305 !important;
  letter-spacing: 0.08em;
  margin: 0 !important;
}
.today-zone .plan-card .compromiso-texto {
  font-size: var(--text-md) !important;
  font-weight: 600 !important;
  margin: var(--space-1) 0 !important;
}
.today-zone .plan-card .compromiso-btn-firmar {
  margin-top: var(--space-2);
}

/* Day 1 wrapper: MANTIENE su look premium (dark bg, border, radius).
 * NO se aplana — tiene su propio tema visual completo.
 * Solo ajustamos el header spacing dentro del wrapper. */
.today-zone .day1-premium-wrapper .day1-header {
  margin-bottom: var(--space-2h) !important;
}
.today-zone .plan-card .day1-badge {
  display: inline-block;
  font-size: 0.66rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--phase-color) !important;
  background: transparent !important;
  padding: 0 !important;
  margin-bottom: var(--space-0) !important;
}
.today-zone .plan-card .day1-title {
  font-size: var(--text-md) !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  margin: 0 !important;
}
.today-zone .plan-card .day1-subtitle {
  font-size: var(--text-sm) !important;
  color: var(--ink-soft) !important;
  margin: var(--space-0) 0 0 0 !important;
}

/* Money tracker (revenue bar): mantenida pero con paleta legible */
.today-zone .plan-card .revenue-bar-container {
  margin: var(--space-3h) 0;
}
.today-zone .plan-card .money-tracker {
  background: var(--surface-tint) !important;
  border: 1px solid var(--line-soft) !important;
  border-radius: 12px !important;
  padding: var(--space-3) !important;
}
.today-zone .plan-card .money-tracker-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: var(--space-2);
}
.today-zone .plan-card .money-tracker-label {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-mute) !important;
  font-weight: 600;
}
.today-zone .plan-card .money-tracker-amount {
  font-size: var(--text-2xl);
  font-weight: 800;
  color: var(--ink) !important;
  letter-spacing: -0.02em;
}
.today-zone .plan-card .money-tracker-status {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: var(--space-0) var(--space-2);
  border-radius: 999px;
}
.today-zone .plan-card .money-tracker-status.start { color: var(--ink-mute); background: rgba(11,20,48,0.05); }
.today-zone .plan-card .money-tracker-status.on-track { color: var(--success); background: var(--success-soft); }
.today-zone .plan-card .money-tracker-status.behind { color: var(--warning); background: var(--warning-soft); }
.today-zone .plan-card .money-tracker-status.ahead { color: var(--success); background: var(--success-soft); }
.today-zone .plan-card .money-tracker-bar {
  height: var(--space-1);
  background: rgba(11,20,48,0.06);
  border-radius: 999px;
  overflow: hidden;
  margin: var(--space-1h) 0;
}
.today-zone .plan-card .money-tracker-fill {
  height: 100%;
  background: var(--phase-color);
  border-radius: 999px;
  transition: width 0.4s ease;
}
.today-zone .plan-card .money-tracker-fill.behind {
  background: var(--warning);
}
.today-zone .plan-card .money-tracker-stats {
  display: flex;
  gap: var(--space-4);
  margin-top: var(--space-1h);
}
.today-zone .plan-card .money-tracker-stat-label {
  font-size: 0.68rem;
  color: var(--ink-mute) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.today-zone .plan-card .money-tracker-stat-value {
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--ink) !important;
}
.today-zone .plan-card .money-tracker-stat-value.gold { color: var(--gold-strong) !important; }
.today-zone .plan-card .money-tracker-stat-value.danger { color: var(--danger) !important; }

/* Plan-section: sin background, padding 0, solo spacing */
.today-zone .plan-card .plan-section {
  margin: var(--space-3) 0;
  padding: 0 !important;
}

/* Tasks-empty-warning: estilo plano con accent ambar */
.today-zone .plan-card .tasks-empty-warning {
  padding: var(--space-2h) var(--space-3) !important;
  border: 1px dashed rgba(217, 119, 6, 0.4) !important;
  border-radius: 8px !important;
  color: var(--warning) !important;
  font-size: var(--text-body);
}

/* Bullets list */
.today-zone .plan-card .bullets {
  margin: var(--space-1) 0 0 0;
  padding-left: var(--space-4);
}
.today-zone .plan-card .bullets li {
  margin: var(--space-0) 0;
}

/* Policy badges: chips planas */
.today-zone .plan-card .policy-badges {
  margin: var(--space-2) 0;
}
.today-zone .plan-card .policy-badges-label {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute) !important;
  margin-bottom: var(--space-1);
}
.today-zone .plan-card .policy-badge {
  display: inline-block;
  padding: 3px 8px !important;
  margin: var(--space-px) var(--space-0) var(--space-px) 0;
  font-size: var(--text-xs);
  font-weight: 600;
  border-radius: 4px !important;
  background: rgba(11,20,48,0.04) !important;
  color: var(--ink) !important;
}
.today-zone .plan-card .policy-critical { color: var(--danger) !important; }
.today-zone .plan-card .policy-required { color: var(--success) !important; }
.today-zone .plan-card .policy-forbidden { color: var(--warning) !important; }

/* Phase triple: indicador discreto */
.today-zone .plan-card .phase-triple-indicator {
  display: inline-flex;
  gap: var(--space-1h);
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  margin-top: var(--space-1);
}
.today-zone .plan-card .phase-triple-cal { color: var(--ink-mute); }
.today-zone .plan-card .phase-triple-op { color: var(--phase-color); font-weight: 700; }
.today-zone .plan-card .phase-triple-sep { color: var(--zone-divider); }

/* Wisdom card (principio + caso): plana con border-left */
.today-zone .plan-card .wisdom-card {
  margin: var(--space-3h) 0;
  padding: var(--space-1h) 0 var(--space-1h) var(--space-2h) !important;
  border-left: var(--space-px) solid rgba(11,20,48,0.15) !important;
}
.today-zone .plan-card .wisdom-head {
  margin-bottom: var(--space-1);
}
.today-zone .plan-card .wisdom-title {
  color: var(--ink-mute) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: var(--text-xs) !important;
}
.today-zone .plan-card .wisdom-row {
  margin: var(--space-1) 0;
}
.today-zone .plan-card .wisdom-row-label {
  font-size: var(--text-xs-plus);
  font-weight: 700;
  color: var(--ink) !important;
  display: inline;
  margin-right: var(--space-0);
}

/* M90 strategic card: mantenida con accent gold pero plana */
.today-zone .plan-card .m90-strategic-card {
  margin: var(--space-4) 0;
  padding: var(--space-2) 0 var(--space-2) var(--space-3) !important;
  border-left: 3px solid var(--gold) !important;
  background: transparent !important;
}
.today-zone .plan-card .m90-strategic-badge {
  display: inline-block;
  font-size: 0.66rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--gold-strong) !important;
}
.today-zone .plan-card .m90-strategic-title {
  font-size: var(--text-base) !important;
  font-weight: 700 !important;
  color: var(--ink) !important;
  margin: var(--space-1) 0 var(--space-0) 0 !important;
}
.today-zone .plan-card .m90-strategic-body {
  color: var(--ink) !important;
  font-size: var(--text-base) !important;
  line-height: 1.55 !important;
}

/* M90 deep dive: flattened in today-zone context */
.today-zone .plan-card .m90-deep-dive {
  margin: var(--space-2h) 0;
  background: transparent !important;
  border: 1px solid rgba(99, 102, 241, 0.15) !important;
  border-left: 3px solid #818cf8 !important;
}
.today-zone .plan-card .m90-deep-dive-badge {
  color: var(--indigo) !important;
  font-size: 0.68rem !important;
}
.today-zone .plan-card .m90-dd-label {
  color: var(--indigo) !important;
}
.today-zone .plan-card .m90-dd-text {
  color: var(--ink) !important;
  font-size: var(--text-body) !important;
  line-height: 1.55 !important;
}

/* Banners aplanados (cycle lag, mentor unread). En lugar de cards
 * separadas, son lineas inline con icono + texto sutil. */
.today-zone .cycle-lag-banner,
.today-zone .mentor-unread-banner {
  background: transparent !important;
  border: 0 !important;
  border-left: var(--space-px) solid var(--warning) !important;
  border-radius: 0 !important;
  padding: var(--space-1) 0 var(--space-1) var(--space-2h) !important;
  margin: 0 0 12px 0 !important;
  box-shadow: none !important;
  font-size: var(--text-sm);
  color: var(--ink) !important;
}
.today-zone .mentor-unread-banner {
  border-left-color: var(--indigo) !important;
}

/* Tareas: la prioridad ya NO se expresa con border de color. La expresa
 * el numero grande (.task-num) con --phase-color. */
.today-zone .task-tier-priority,
.today-zone .task-tier-extended,
.today-zone .task-tier-overachiever {
  border-left: 0 !important;
  background: transparent !important;
  padding-left: 0 !important;
}
.today-zone .task-num {
  color: var(--phase-color);
  font-weight: 900;
  font-size: var(--text-xl);
  margin-right: var(--space-1h);
  letter-spacing: -0.03em;
}

/* ============================================================
 * TODAY ZONES — Bloques estaticos del template (audit 2026-04-09)
 * ============================================================
 * Antes vivian con inline styles que asumian fondo oscuro: borders
 * blancos invisibles sobre fondo blanco, colors pastel ilegibles.
 * Estas clases reemplazan los inline styles con tipografia plana
 * que respeta la paleta del .container (fondo blanco). */

/* Diagnostico del dia: bloque plano con accent indigo */
.today-zone .today-diagnostico-block {
  margin-top: var(--space-3);
  padding: var(--space-1) 0 var(--space-1) var(--space-3);
  border-left: var(--space-px) solid rgba(79, 70, 229, 0.35);
}
.today-zone .today-diagnostico-title {
  margin: 0 0 6px 0 !important;
  color: var(--indigo-strong) !important;
}
.today-zone .today-diagnostico-text {
  font-size: var(--text-body);
  color: var(--ink);
}

/* DeudaBox aplanado: accent ambar plano */
.today-zone .today-warning-block {
  margin-top: var(--space-3);
  padding: var(--space-2) 0 var(--space-2) var(--space-3);
  border-left: 3px solid var(--warning);
}
.today-zone .today-warning-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-2h);
  margin-bottom: var(--space-1h);
  flex-wrap: wrap;
}
.today-zone .today-warning-title {
  font-size: var(--text-base);
  font-weight: 800;
  color: var(--warning);
  margin-bottom: var(--space-px);
}
.today-zone .today-warning-sub {
  font-size: var(--text-sm);
  color: var(--ink-soft);
  line-height: 1.5;
}
.today-zone .today-warning-pmv {
  margin-top: var(--space-2);
}
.today-zone .today-warning-pmv-title {
  font-size: var(--text-xs-plus);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-mute);
  margin-bottom: var(--space-0);
}
.today-zone .today-warning-pmv-text {
  white-space: pre-wrap;
  margin: 0;
  font-size: var(--text-sm);
  line-height: 1.5;
  color: var(--ink);
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm);
  padding: var(--space-1h) var(--space-2);
}
.today-zone .today-warning-hint {
  margin-top: var(--space-1h);
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
}

/* Emergencia (modo recovery): accent rojo plano */
.today-zone .today-emergency-block {
  margin-top: var(--space-3);
  padding: var(--space-2) 0 var(--space-2) var(--space-3);
  border-left: 3px solid var(--danger);
}
.today-zone .today-emergency-title {
  margin: 0 0 8px 0;
  font-size: var(--text-base);
  font-weight: 800;
  color: var(--danger);
}
.today-zone .today-emergency-text {
  margin: 0 0 10px 0;
  font-size: var(--text-body);
  color: var(--ink);
}
.today-zone .today-emergency-mvp {
  margin-top: var(--space-2);
}
.today-zone .today-emergency-mvp-title {
  margin: 0 0 6px 0;
  font-size: var(--text-xs-plus);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ink-mute);
}
.today-zone .today-emergency-mvp-text {
  white-space: pre-wrap;
  margin: 0;
  padding: var(--space-1h) var(--space-2);
  border-radius: var(--radius-sm);
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  font-size: var(--text-sm);
  color: var(--ink);
}
.today-zone .today-emergency-status-row {
  margin-top: var(--space-2);
}
.today-zone .today-emergency-status {
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--ink-soft);
}

/* QuickComplete panel: spacing limpio */
.today-zone .today-quickcomplete {
  margin-top: var(--space-3);
}
.today-zone .today-quickcomplete-note {
  width: 100%;
  margin-top: var(--space-1h);
  resize: vertical;
}
.today-zone .today-quickcomplete-actions {
  margin-top: var(--space-1h);
  display: flex;
  gap: var(--space-1h);
  flex-wrap: wrap;
}

/* Evidence form: spacing y tipografia plana sin cajas */
.today-zone .today-evidence-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-2h);
  flex-wrap: wrap;
  gap: var(--space-2);
}
.today-zone .today-evidence-h3 {
  margin: 0;
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--ink);
}
/* Propósito del panel de evidencia (QA founder 2026-06-12): una línea que
   explica qué se registra y para qué lo usa el motor. */
.today-zone .today-evidence-purpose {
  font-size: var(--text-sm);
  color: var(--ink-soft);
  line-height: 1.5;
  margin: var(--space-1) 0 var(--space-2h);
}
.today-zone .today-evidence-autosave {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  margin: var(--space-0) 0 var(--space-2) 0;
}
.today-zone .today-evidence-task-fields {
  margin-bottom: var(--space-2);
}
.today-zone .today-evidence-separator {
  margin: var(--space-3) 0 var(--space-1h);
  padding-top: var(--space-2h);
  border-top: 1px solid var(--zone-divider);
}
.today-zone .today-evidence-narrative-label {
  font-size: var(--text-xs-plus);
  font-weight: 700;
  color: var(--ink-mute);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: var(--space-0);
}
.today-zone .today-evidence-label {
  display: block;
  margin: var(--space-2h) 0 var(--space-1);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--ink-soft);
}
.today-zone .today-evidence-textarea,
.today-zone .today-evidence-text-input {
  width: 100%;
  resize: vertical;
  padding: var(--space-1h) var(--space-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: var(--text-base);
  background: var(--surface);
  color: var(--ink);
  font-family: inherit;
}
.today-zone .today-evidence-textarea:focus,
.today-zone .today-evidence-text-input:focus,
.today-zone .today-evidence-num:focus,
.today-zone .today-evidence-channel-select:focus {
  outline: var(--space-px) solid var(--primary);
  outline-offset: 1px;
}
.today-zone .today-evidence-metrics-row {
  display: flex;
  gap: var(--space-3);
  margin-top: var(--space-2);
  flex-wrap: wrap;
}
#econEvidenceRow:not(.hidden) { display: flex; }
.today-zone .today-evidence-metrics-row label {
  font-size: var(--text-xs-plus);
  font-weight: 600;
  color: var(--ink-soft);
}
.today-zone .today-evidence-num {
  width: 100px;
  padding: var(--space-1) var(--space-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  font-size: var(--text-base);
  background: var(--surface);
  color: var(--ink);
}
.today-zone .today-evidence-channel-row {
  margin-top: var(--space-2h);
}
.today-zone .today-evidence-channel-row label {
  font-size: var(--text-xs-plus);
  font-weight: 600;
  color: var(--ink-soft);
}
.today-zone .today-evidence-channel-select {
  width: 100%;
  max-width: 220px;
  padding: var(--space-1) var(--space-2);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  font-size: var(--text-base);
  background: var(--surface);
  color: var(--ink);
}

/* Header de estado plano: sin border ni background del wrapper. */
.today-zone #progresoUsuario,
.today-zone .bienvenida {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}

/* Evidence box plano: sin border, sin padding del wrapper. El form
 * vive directamente sobre la zona. */
.today-zone #evidenciaBox {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
.today-zone #evidenceFormBox {
  padding: 0;
}

/* Botonera dentro de la zona — sin margin-top extra de cada boton */
.today-zone .botonera-dia,
.today-zone #acciones {
  margin-top: var(--space-4);
}

/* Diagnostico Box (legacy): convertirlo en bloque plano con accent indigo */
.today-zone #diagnosticoBox > div {
  background: transparent !important;
  border: 0 !important;
  border-left: var(--space-px) solid rgba(79, 70, 229, 0.35) !important;
  border-radius: 0 !important;
  padding: var(--space-0) 0 var(--space-0) var(--space-2h) !important;
}

/* h2 #diaActual: sin estilos de card, solo titulo dentro de Mission */
.today-zone #diaActual {
  margin: 0 0 12px 0;
  font-size: var(--text-md);
  font-weight: 700;
  color: var(--ink);
  letter-spacing: -0.01em;
}

/* mensajeCompletado / tomorrowPreview / loaders dentro de Evidence zone:
 * mantienen su look propio pero sin margenes extra de tab-hidden. */
.today-zone #tomorrowPreview {
  margin-top: var(--space-3h);
}

/* ═══ FEATURE 1: Parking Lot — Ideas Bank ═══ */
.parking-lot-panel {
  margin: 0 0 16px;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.parking-lot-panel.hidden { display: none; }
.pl-container {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: var(--space-4h) 22px;
  color: var(--ink);
  box-shadow: 0 8px 24px -8px rgba(11, 20, 48, 0.10),
              0 2px 6px -2px rgba(11, 20, 48, 0.06);
}
.pl-title {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--ink-mute);
  margin-bottom: var(--space-0);
}
.pl-subtitle {
  font-size: var(--text-xs-plus);
  color: var(--ink-soft);
  margin-bottom: var(--space-3);
}
.pl-ideas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1h);
}
.pl-idea {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
  padding: var(--space-1h) var(--space-3);
  font-size: var(--text-sm);
  color: var(--ink);
  line-height: 1.35;
}
.pl-idea-icon {
  flex-shrink: 0;
  font-size: var(--text-base);
}
.pl-empty {
  font-size: var(--text-sm);
  color: var(--ink-mute);
  font-style: italic;
}

/* ═══ FEATURE 2: Revenue Journal Banner + Modal ═══ */
.revenue-journal-banner {
  margin: 0 0 12px;
}
.revenue-journal-banner.hidden { display: none; }
.rj-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2h);
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.08), rgba(79, 70, 229, 0.06));
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 12px;
  padding: var(--space-2h) var(--space-3h);
}
.rj-banner-text {
  font-size: var(--text-body);
  font-weight: 600;
  color: var(--primary);
}
.rj-banner-cta {
  flex-shrink: 0;
  background: var(--primary);
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: var(--space-1h) var(--space-3h);
  font-size: var(--text-sm);
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s;
}
.rj-banner-cta:hover { background: var(--primary-strong); }

.rj-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(10, 21, 48, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.rj-modal-overlay.hidden { display: none; }
.rj-modal {
  background: #ffffff;
  border-radius: 16px;
  padding: 28px 24px;
  max-width: 440px;
  width: 90vw;
  box-shadow: 0 24px 48px -12px rgba(0,0,0,0.25);
  color: var(--ink);
}
.rj-modal-title {
  font-size: var(--text-md);
  font-weight: 800;
  margin-bottom: var(--space-0);
  color: var(--ink);
}
.rj-modal-desc {
  font-size: var(--text-sm);
  color: var(--ink-soft);
  margin-bottom: var(--space-4);
  line-height: 1.4;
}
.rj-field {
  margin-bottom: var(--space-3);
}
.rj-field label {
  display: block;
  font-size: var(--text-xs-plus);
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 5px;
}
.rj-field input,
.rj-field select {
  width: 100%;
  padding: var(--space-2) var(--space-2h);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: var(--text-body);
  color: var(--ink);
  background: var(--surface-tint);
  box-sizing: border-box;
}
.rj-field input:focus,
.rj-field select:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
}
.rj-actions {
  display: flex;
  gap: var(--space-2);
  margin-top: var(--space-4);
}
.rj-btn-submit {
  flex: 1;
  background: var(--primary);
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: 11px 16px;
  font-size: var(--text-body);
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s;
}
.rj-btn-submit:hover { background: var(--primary-strong); }
.rj-btn-submit:disabled { opacity: 0.5; cursor: not-allowed; }
.rj-btn-cancel {
  background: transparent;
  color: var(--ink-soft);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px 16px;
  font-size: var(--text-body);
  font-weight: 600;
  cursor: pointer;
}
.rj-btn-cancel:hover { background: var(--surface-tint); }

/* ═══ FEATURE 3: Memory Graph — Your Business Journey ═══ */
.memory-graph-panel {
  margin: 0 0 16px;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.memory-graph-panel.hidden { display: none; }
.mg-container {
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: var(--space-4h) 22px;
  color: var(--ink);
  box-shadow: 0 8px 24px -8px rgba(11, 20, 48, 0.10),
              0 2px 6px -2px rgba(11, 20, 48, 0.06);
}
.mg-title {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--ink-mute);
  margin-bottom: var(--space-3h);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mg-toggle {
  font-size: var(--text-xs);
  color: var(--ink-mute);
  transition: transform 0.2s;
}
.mg-toggle.collapsed { transform: rotate(-90deg); }
.mg-body { }
.mg-body.collapsed { display: none; }
.mg-section {
  margin-bottom: var(--space-3);
}
.mg-section:last-child { margin-bottom: 0; }
.mg-section-title {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-soft);
  margin-bottom: var(--space-1h);
}
.mg-items {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.mg-item {
  display: flex;
  align-items: flex-start;
  gap: var(--space-2);
  padding: var(--space-1h) var(--space-2h);
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  line-height: 1.35;
}
.mg-dot {
  flex-shrink: 0;
  width: var(--space-1h);
  height: var(--space-1h);
  border-radius: 50%;
  margin-top: var(--space-0);
}
.mg-dot-winner { background: var(--success); }
.mg-dot-testing { background: var(--primary); }
.mg-dot-discarded { background: var(--ink-mute); }
.mg-dot-victory { background: var(--success); }
.mg-dot-mistake { background: var(--danger); }

/* audit 2026-05-04: victory rica V2 con canal/segmento/pitch/objecion/aprendizaje */
.mg-item-victory { flex-direction: column; gap: 6px; padding: 10px 12px; }
.mg-item-victory .mg-item-row { display: flex; align-items: center; gap: 8px; width: 100%; }
.mg-vic-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.mg-vic-tag {
  font-size: 11px;
  padding: 2px 8px;
  background: rgba(16, 185, 129, 0.10);
  color: #047857;
  border-radius: 9999px;
  font-weight: 600;
}
.mg-vic-pitch {
  font-style: italic;
  color: #1f2937;
  background: rgba(99, 102, 241, 0.06);
  padding: 6px 10px;
  border-left: 3px solid #6366f1;
  border-radius: 4px;
  font-size: 13px;
}
.mg-vic-obj {
  font-size: 12px;
  color: #475569;
  padding: 4px 0;
}
.mg-vic-obj b { color: #b45309; }
.mg-vic-learn {
  font-size: 12px;
  color: #166534;
  padding: 4px 8px;
  background: rgba(16, 185, 129, 0.06);
  border-radius: 4px;
}
.mg-item-text {
  flex: 1;
  color: var(--ink);
}
.mg-item-day {
  flex-shrink: 0;
  font-size: var(--text-xs);
  color: var(--ink-mute);
  white-space: nowrap;
}
.mg-narrative {
  font-size: var(--text-sm);
  color: var(--ink-soft);
  line-height: 1.45;
  padding: var(--space-2) var(--space-2h);
  background: var(--surface-tint);
  border-left: 3px solid var(--primary);
  border-radius: 0 10px 10px 0;
  margin-top: var(--space-2h);
}
.mg-discarded-toggle {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: var(--space-0);
  margin-bottom: var(--space-1);
}
.mg-discarded-toggle:hover { color: var(--ink-soft); }
.mg-discarded-items { display: none; }
.mg-discarded-items.open { display: flex; flex-direction: column; gap: var(--space-1); }

/* ═══ FEATURE 4: System Verdict — enriched styles ═══ */
.sv-decision-enriched {
  margin-top: var(--space-1h);
  padding: var(--space-1h) var(--space-2h);
  background: var(--surface-tint);
  border-radius: 8px;
  border-left: 3px solid var(--primary);
}
.sv-outcome-label {
  font-size: var(--text-body);
  font-weight: 700;
  color: var(--ink);
}
.sv-why-short {
  font-size: var(--text-xs-plus);
  color: var(--ink-soft);
  margin-top: var(--space-0);
  line-height: 1.35;
}
.sv-next-mission {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  margin-top: var(--space-0);
}
.sv-confidence-enriched {
  margin-top: var(--space-2);
}
.sv-confidence-title {
  font-size: var(--text-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-mute);
  margin-bottom: var(--space-1);
}
.sv-breakdown-row {
  display: flex;
  align-items: center;
  gap: var(--space-1h);
  margin-bottom: var(--space-0);
  font-size: var(--text-xs-plus);
}
.sv-breakdown-label {
  width: 100px;
  flex-shrink: 0;
  color: var(--ink-soft);
}
.sv-breakdown-bar {
  flex: 1;
  height: var(--space-1);
  background: var(--line-soft);
  border-radius: 3px;
  overflow: hidden;
}
.sv-breakdown-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s ease;
}
.sv-breakdown-value {
  width: var(--space-6);
  flex-shrink: 0;
  text-align: right;
  color: var(--ink-mute);
  font-weight: 600;
}
.sv-feedback-text {
  font-size: var(--text-xs-plus);
  color: var(--ink-soft);
  margin-top: var(--space-1);
  line-height: 1.35;
  font-style: italic;
}

/* ═══ FEATURE 5: Objetivo Vivo — Your Mission ═══ */
.ov-panel {
  margin: 0 0 10px;
}
.ov-panel.hidden { display: none; }
.ov-container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-3);
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.05), rgba(79, 70, 229, 0.04));
  border: 1px solid rgba(37, 99, 235, 0.12);
  border-radius: 12px;
  padding: var(--space-2) var(--space-3h);
}
.ov-title-label {
  font-size: var(--text-xs);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--primary);
  margin-right: var(--space-0);
}
.ov-item {
  display: inline-flex;
  align-items: center;
  gap: var(--space-0);
  font-size: var(--text-xs-plus);
  color: var(--ink);
}
.ov-item-label {
  color: var(--ink-mute);
  font-weight: 600;
}
.ov-item-value {
  font-weight: 700;
}
.ov-sep {
  color: var(--line);
  font-size: 0.6rem;
}
.ov-blocker {
  display: inline-flex;
  align-items: center;
  gap: var(--space-0);
  font-size: var(--text-xs-plus);
  color: var(--warning);
  font-weight: 600;
}
.ov-goal-achieved {
  display: inline-flex;
  align-items: center;
  gap: var(--space-0);
  font-size: var(--text-sm);
  color: var(--success);
  font-weight: 700;
}

/* ═══ FEATURE 6a: Phase desfase humanized ═══ */
.phase-desfase-friendly {
  font-size: var(--text-xs-plus);
  font-weight: 600;
  color: var(--primary);
  padding: var(--space-0) var(--space-2);
  background: rgba(37, 99, 235, 0.06);
  border-radius: var(--radius-sm);
  display: inline-block;
  margin-top: var(--space-px);
}

/* ═══ Mobile responsive for new panels ═══ */
@media (max-width: 480px) {
  .pl-ideas { gap: var(--space-1); }
  .pl-idea { padding: var(--space-1) var(--space-2); font-size: var(--text-xs-plus); }
  .mg-item { padding: var(--space-1) var(--space-2); font-size: var(--text-xs-plus); }
  .ov-container { padding: var(--space-1h) var(--space-2h); gap: var(--space-0) var(--space-2); }
  .ov-item { font-size: var(--text-xs-plus); }
  .rj-banner { flex-direction: column; align-items: stretch; gap: var(--space-1h); padding: var(--space-2) var(--space-3); }
  .rj-banner-cta { text-align: center; }
  .sv-breakdown-label { width: 80px; }
}

/* =============================================
   PREMIUM INTELLIGENCE LAYER (Motores 11-16)
   ============================================= */

/* Shared premium panel styling */
.premium-intel-panel {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
  border: 1px solid rgba(99, 102, 241, 0.3);
  border-radius: 12px;
  padding: var(--space-3h);
  margin-bottom: var(--space-2h);
  color: #e2e8f0;
}
.premium-panel-header h4 {
  margin: 0 0 12px 0;
  font-size: var(--text-base);
  color: #a5b4fc;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* --- Predictions Dashboard --- */
.pred-card {
  background: rgba(255,255,255,0.05);
  border-radius: 8px;
  padding: var(--space-2) var(--space-2h);
  margin-bottom: var(--space-1h);
  border-left: 3px solid #64748b;
}
.pred-card.pred-green { border-left-color: #22c55e; }
.pred-card.pred-yellow { border-left-color: #eab308; }
.pred-card.pred-red { border-left-color: #ef4444; }
.pred-card.pred-neutral { border-left-color: #6366f1; }
.pred-label { font-size: var(--text-xs-plus); color: var(--ink-mute-dark); text-transform: uppercase; margin-bottom: var(--space-0); }
.pred-value { font-size: var(--text-base); color: #f1f5f9; }
.pred-detail { font-size: var(--text-sm); color: var(--ink-mute-dark); margin-top: var(--space-0); }
.pred-deficit { color: #fbbf24; font-weight: 600; }
.pred-accelerators { margin-top: var(--space-1h); font-size: var(--text-body); }
.pred-accelerators ul { margin: var(--space-0) 0 0 var(--space-3h); padding: 0; }
.pred-accelerators li { margin-bottom: var(--space-0); color: var(--ink-mute-dark); }
.pred-targets { display: flex; gap: var(--space-1h); flex-wrap: wrap; margin-top: var(--space-1); }
.target-pill { background: rgba(99, 102, 241, 0.2); padding: 4px var(--radius-md); border-radius: 16px; font-size: var(--text-sm); color: #c7d2fe; }
.pred-anomalies { margin-top: var(--space-1h); }
.anomaly-item { padding: 4px 8px; margin: 4px 0; border-radius: 4px; font-size: var(--text-sm); }
.anomaly-item.anomaly-high, .anomaly-item.anomaly-critical { background: rgba(239, 68, 68, 0.15); color: #fca5a5; }
.anomaly-item.anomaly-medium { background: rgba(234, 179, 8, 0.15); color: #fde68a; }
.pred-actions { margin-top: var(--space-2); }

/* --- Experiment Dashboard --- */
.exp-active-card {
  background: rgba(99, 102, 241, 0.1);
  border: 1px solid rgba(99, 102, 241, 0.3);
  border-radius: 8px;
  padding: var(--space-2h);
}
.exp-status { font-size: var(--text-body); margin-bottom: var(--space-1h); color: #a5b4fc; }
.exp-type { font-size: var(--text-sm); color: var(--ink-mute-dark); }
.exp-hypothesis { margin: var(--space-1h) 0; font-size: var(--text-base); color: #e2e8f0; }
.exp-variants { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-1h); margin: var(--space-1h) 0; }
.exp-variant-a, .exp-variant-b { background: rgba(255,255,255,0.05); padding: 8px; border-radius: var(--radius-sm); font-size: var(--text-sm); }
.exp-results-mini { display: flex; justify-content: space-around; padding: 8px; background: rgba(0,0,0,0.2); border-radius: var(--radius-sm); margin: 8px 0; font-size: var(--text-body); font-family: monospace; }
.exp-summary { display: flex; align-items: center; gap: var(--space-2h); font-size: var(--text-body); }

/* --- Sales Copilot --- */
.copilot-quick-access { margin: var(--space-1h) 0; }
.btn-copilot {
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  color: white;
  border: none;
  padding: var(--space-2) var(--space-4h);
  border-radius: 8px;
  font-size: var(--text-base);
  cursor: pointer;
  width: 100%;
  transition: opacity 0.2s;
}
.btn-copilot:hover { opacity: 0.9; }
.copilot-stats { font-size: var(--text-body); color: var(--ink-mute-dark); margin-bottom: var(--space-2); }
.copilot-skills { display: flex; flex-direction: column; gap: var(--space-1); margin: var(--space-1h) 0; }
.skill-row { display: flex; align-items: center; gap: var(--space-1h); }
.skill-label { width: 100px; font-size: var(--text-xs-plus); color: var(--ink-mute-dark); text-align: right; }
.skill-bar { flex: 1; height: 8px; background: rgba(255,255,255,0.1); border-radius: 4px; overflow: hidden; }
.skill-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; }
.skill-val { font-size: var(--text-xs-plus); color: var(--ink-mute-dark); width: 35px; }
.copilot-objections { margin-top: var(--space-1h); font-size: var(--text-sm); }
.obj-tag { background: rgba(239, 68, 68, 0.15); color: #fca5a5; padding: 2px 8px; border-radius: var(--radius-md); font-size: var(--text-xs-plus); margin-left: 4px; }

/* Copilot Modal */
.copilot-modal, .research-modal, .experiment-modal, .scenario-modal { max-width: 640px; width: 95%; }
.modal-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.7); z-index: var(--z-modal);
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}
.modal-overlay.hidden { display: none; }
.modal-content {
  background: #1e1e2e; border: 1px solid rgba(99, 102, 241, 0.3);
  border-radius: 16px; padding: 0; overflow: hidden; max-height: 90vh; overflow-y: auto;
}
.modal-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: var(--space-3h) var(--space-4h); border-bottom: 1px solid rgba(255,255,255,0.1);
  background: rgba(99, 102, 241, 0.1);
}
.modal-header h3 { margin: 0; font-size: var(--text-lg); color: #a5b4fc; }
.modal-close { background: none; border: none; color: var(--ink-mute-dark); font-size: var(--text-3xl); cursor: pointer; }
.modal-close:hover { color: #f1f5f9; }
.copilot-body, .research-body, .experiment-body, .scenario-body { padding: var(--space-3h) var(--space-4h); }
.copilot-textarea {
  width: 100%; background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px; padding: var(--radius-md); color: #e2e8f0; font-size: var(--text-base);
  resize: vertical; font-family: inherit;
}
.copilot-textarea:focus { outline: none; border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2); }
.copilot-options { display: flex; gap: var(--space-1h); margin-top: var(--space-2); align-items: center; flex-wrap: wrap; }
.copilot-options select {
  background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.1);
  color: #e2e8f0; padding: 8px; border-radius: var(--radius-sm);
}
.copilot-results { margin-top: var(--space-3h); }
.cop-score { padding: var(--radius-md) var(--radius-lg); background: rgba(0,0,0,0.2); border-radius: 8px; margin-bottom: var(--radius-md); font-size: var(--text-md); }
.cop-section { margin: var(--space-2) 0; font-size: var(--text-body); }
.cop-section ul { margin: var(--space-0) 0 0 var(--space-3h); }
.cop-section li { margin-bottom: var(--space-0); }
.obj-type { background: rgba(239, 68, 68, 0.2); color: #fca5a5; padding: 1px var(--radius-sm); border-radius: 4px; font-size: var(--text-sm); }
.cop-positives { background: rgba(34, 197, 94, 0.1); padding: var(--radius-md); border-radius: 8px; }
.cop-followup { background: rgba(99, 102, 241, 0.1); padding: var(--radius-md); border-radius: 8px; }
.cop-suggestions { margin-top: var(--space-2); }
.cop-suggestion-variant { background: rgba(0,0,0,0.2); padding: var(--radius-md); border-radius: 8px; margin: 8px 0; }
.variant-name { font-size: var(--text-sm); color: #a5b4fc; text-transform: uppercase; margin-bottom: var(--space-0); }
.variant-text { font-size: var(--text-base); color: #f1f5f9; white-space: pre-wrap; }
.variant-why { font-size: var(--text-sm); color: var(--ink-mute-dark); margin-top: var(--space-1); font-style: italic; }

/* --- Copilot Scripts --- */
.cop-script-steps { margin: var(--space-1) 0 0 var(--space-3h); }
.cop-script-steps li { margin-bottom: var(--space-2); }
.cop-script-msg { background: rgba(99, 102, 241, 0.12); padding: var(--radius-sm) var(--radius-md); border-radius: 6px; font-size: var(--text-base); color: #e2e8f0; white-space: pre-wrap; }
.cop-script-branch { font-size: var(--text-sm); padding: 2px 0 2px var(--space-2); color: var(--ink-mute-dark); }
.cop-script-note { font-size: var(--text-sm); color: var(--ink-mute-dark); }

/* --- Experiment Modal --- */
.exp-rec-card { background: rgba(0,0,0,0.2); padding: var(--radius-lg); border-radius: 8px; margin: var(--space-2) 0; }
.exp-form { margin-top: var(--space-2); }
.exp-form-field { display: flex; flex-direction: column; gap: 4px; margin-bottom: var(--space-1); }
.exp-form-field label { font-size: var(--text-sm); color: #a5b4fc; font-weight: 600; }
.exp-form-field input, .exp-form-field textarea, .exp-form-field select { background: rgba(255,255,255,0.06); border: 1px solid rgba(99,102,241,0.3); border-radius: 6px; padding: 6px 10px; color: #e2e8f0; font-size: var(--text-body); }
.exp-form-field textarea { resize: vertical; min-height: 40px; }
.exp-form-actions { margin-top: var(--space-2); }
.exp-update-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-1) var(--space-2); }
.exp-conclusion-card { background: rgba(34,197,94,0.12); border-left: 4px solid #22c55e; padding: var(--radius-md) var(--radius-lg); border-radius: 8px; margin-top: var(--space-2); }
.exp-conclusion-card div { margin-bottom: 4px; }
.exp-hist-item { background: rgba(0,0,0,0.15); padding: var(--radius-md); border-radius: 6px; margin: var(--space-1) 0; }
.exp-hist-winner { font-size: var(--text-sm); color: #a5b4fc; }
.exp-hist-rates { font-size: var(--text-sm); color: var(--ink-mute-dark); }

/* --- Research --- */
.research-section { margin: var(--space-2) 0; }
.prospect-card, .competitor-card {
  background: rgba(255,255,255,0.05); padding: 8px 12px; border-radius: 8px; margin: var(--radius-sm) 0;
}
.prospect-name, .competitor-name { font-weight: 600; color: #f1f5f9; }
.prospect-title, .competitor-pricing { font-size: var(--text-sm); color: var(--ink-mute-dark); }
.prospect-score { font-size: var(--text-xs-plus); color: #a5b4fc; }
.research-actions { display: flex; gap: var(--space-1h); margin-top: var(--space-2); }
.research-results { margin-top: var(--space-3h); }
.res-section { margin: var(--space-2) 0; }
.prospect-result { padding: 8px; background: rgba(255,255,255,0.05); border-radius: var(--radius-sm); margin: var(--radius-sm) 0; font-size: var(--text-body); }

/* --- Connections --- */
.conn-list { display: flex; flex-direction: column; gap: var(--space-1); }
.conn-item { display: flex; align-items: center; gap: 8px; font-size: var(--text-body); padding: var(--radius-sm) 8px; background: rgba(255,255,255,0.05); border-radius: var(--radius-sm); }
.conn-trust { font-size: var(--text-xs-plus); color: var(--ink-mute-dark); margin-left: auto; }
.conn-trust-total { margin-top: var(--space-1h); font-size: var(--text-body); color: #a5b4fc; text-align: center; }
.conn-empty { text-align: center; color: #64748b; font-size: var(--text-body); padding: var(--space-2h); }

/* --- Scenario --- */
.scenario-options { display: flex; gap: var(--space-1h); align-items: center; flex-wrap: wrap; }
.scenario-options select { background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.1); color: #e2e8f0; padding: 8px; border-radius: var(--radius-sm); }
.scenario-input { width: 60px; background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.1); color: #e2e8f0; padding: 8px; border-radius: var(--radius-sm); text-align: center; }
.scenario-results { margin-top: var(--space-3h); }
.scenario-result { background: rgba(0,0,0,0.2); padding: var(--radius-lg); border-radius: var(--radius-md); }
.scenario-header { font-size: var(--text-md); color: #a5b4fc; margin-bottom: var(--space-2h); }
.scenario-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2h); }
.scenario-base, .scenario-new { padding: var(--radius-md); border-radius: 8px; font-size: var(--text-body); }
.scenario-base { background: rgba(100,116,139,0.2); }
.scenario-new { background: rgba(99, 102, 241, 0.2); }
.scenario-delta { margin-top: var(--radius-md); padding: 8px; background: rgba(34, 197, 94, 0.1); border-radius: var(--radius-sm); font-size: var(--text-base); color: #86efac; }
.scenario-confidence { font-size: var(--text-sm); color: var(--ink-mute-dark); margin-top: var(--space-1); }

/* --- Shared UI --- */
.btn-primary {
  background: #6366f1; color: white; border: none; padding: var(--space-1h) var(--space-3h);
  border-radius: var(--radius-sm); cursor: pointer; font-size: var(--text-body);
}
.btn-primary:hover { background: #4f46e5; }
.btn-primary:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-secondary {
  background: transparent; color: #a5b4fc; border: 1px solid #6366f1;
  padding: 8px 16px; border-radius: var(--radius-sm); cursor: pointer; font-size: var(--text-body);
}
.btn-secondary:hover { background: rgba(99, 102, 241, 0.1); }
.loading { text-align: center; color: var(--ink-mute); padding: var(--space-4h); }
.error { color: #fca5a5; padding: var(--radius-md); background: rgba(239, 68, 68, 0.1); border-radius: var(--radius-sm); }

/* Experiment recommendation/active in modal */
.experiment-recommendation { padding: var(--space-2) 0; }
.experiment-active { padding: var(--space-2) 0; }
.experiment-history { padding: var(--space-2) 0; }

/* ═══════════════════════════════════════════
   MISSION CONTROL — Animated Dashboard
   ═══════════════════════════════════════════ */

/* --- Animated Count-Up --- */
.mc-countup { display: inline-block; min-width: 1ch; }

/* --- Funnel Visualization --- */
.mc-funnel {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 260px;
  margin: var(--space-1h) auto var(--space-0);
  position: relative;
  overflow: hidden;
}
.mc-funnel-section {
  width: 100%;
  text-align: center;
  padding: var(--space-2) 0;
  position: relative;
  color: #fff;
}
.mc-funnel-section--msg {
  clip-path: polygon(2% 0, 98% 0, 88% 100%, 12% 100%);
  background: linear-gradient(135deg, #6366f1, #818cf8);
  padding: var(--space-3) 0 var(--space-2h);
}
.mc-funnel-section--lead {
  clip-path: polygon(12% 0, 88% 0, 78% 100%, 22% 100%);
  background: linear-gradient(135deg, #8b5cf6, #a78bfa);
  margin-top: -2px;
  padding: var(--space-2) 0;
}
.mc-funnel-section--sale {
  clip-path: polygon(22% 0, 78% 0, 68% 100%, 32% 100%);
  background: linear-gradient(135deg, #f59e0b, #fbbf24);
  margin-top: -2px;
  padding: var(--space-2) 0 var(--space-2h);
}
.mc-funnel-number {
  font-size: var(--text-2xl);
  font-weight: 800;
  line-height: 1.1;
  text-shadow: 0 1px 4px rgba(0,0,0,0.2);
}
.mc-funnel-label {
  font-size: 0.62rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  opacity: 0.85;
  font-weight: 600;
}
.mc-funnel-rate {
  font-size: 0.68rem;
  color: #64748b;
  font-weight: 600;
  margin: -1px 0;
  text-align: center;
}
.mc-funnel-empty {
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  text-align: center;
  padding: var(--space-1) 0 0;
}
.mc-funnel-momentum {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  margin-top: var(--space-1);
  font-size: var(--text-xs-plus);
}

/* Funnel Particles */
.mc-funnel-particle {
  position: absolute;
  width: var(--space-0);
  height: var(--space-0);
  border-radius: 50%;
  opacity: 0;
  will-change: transform, opacity;
  pointer-events: none;
}
@keyframes mcParticleFall {
  0% { opacity: 0; transform: translateY(0) translateX(var(--px, 0px)); }
  15% { opacity: 0.8; }
  85% { opacity: 0.6; }
  100% { opacity: 0; transform: translateY(var(--fall-dist, 120px)) translateX(var(--px2, 0px)); }
}

@media (max-width: 480px) {
  .mc-funnel { max-width: 220px; }
  .mc-funnel-number { font-size: var(--text-lg); }
}

/* --- Business Health Heartbeat --- */
.mc-heartbeat {
  position: relative;
  width: var(--space-3h);
  height: var(--space-3h);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.mc-heartbeat-core {
  width: var(--space-2);
  height: var(--space-2);
  border-radius: 50%;
  z-index: var(--z-local);
}
.mc-heartbeat-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  opacity: 0.4;
}
.mc-heartbeat--healthy .mc-heartbeat-core { background: #10b981; }
.mc-heartbeat--healthy .mc-heartbeat-ring {
  background: #10b981;
  animation: mcHeartbeat 2s ease-in-out infinite;
}
.mc-heartbeat--warning .mc-heartbeat-core { background: #f59e0b; }
.mc-heartbeat--warning .mc-heartbeat-ring {
  background: #f59e0b;
  animation: mcHeartbeat 1.5s ease-in-out infinite;
}
.mc-heartbeat--critical .mc-heartbeat-core { background: #ef4444; }
.mc-heartbeat--critical .mc-heartbeat-ring {
  background: #ef4444;
  animation: mcHeartbeat 1s ease-in-out infinite;
}
.mc-heartbeat--unknown .mc-heartbeat-core { background: #94a3b8; }
.mc-heartbeat--unknown .mc-heartbeat-ring { display: none; }
@keyframes mcHeartbeat {
  0%, 100% { transform: scale(1); opacity: 0.4; }
  50% { transform: scale(2); opacity: 0; }
}

/* --- Rank-Up Animation --- */
.mc-rankup-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-celebration);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15, 23, 42, 0.85);
  backdrop-filter: blur(12px);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.mc-rankup-overlay.hidden { display: none; }
.mc-rankup-overlay.mc-rankup-active { opacity: 1; }
.mc-rankup-flash {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle, rgba(245,158,11,0.5) 0%, transparent 65%);
  opacity: 0;
}
.mc-rankup-active .mc-rankup-flash {
  animation: mcRankFlash 0.8s ease-out forwards;
}
@keyframes mcRankFlash {
  0% { opacity: 0; transform: scale(0.5); }
  35% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.5); }
}
.mc-rankup-content {
  position: relative;
  text-align: center;
  z-index: var(--z-local);
}
.mc-rankup-old {
  font-size: var(--text-3xl);
  font-weight: 700;
  color: rgba(255,255,255,0.6);
  opacity: 1;
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.mc-rankup-active .mc-rankup-old {
  opacity: 0;
  transform: scale(0.5) translateY(-20px);
}
.mc-rankup-new {
  font-size: clamp(2rem, 8vw, 3rem);
  font-weight: 800;
  color: #fff;
  opacity: 0;
  transform: scale(0.3);
  text-shadow: 0 0 40px rgba(245,158,11,0.7), 0 0 80px rgba(245,158,11,0.3);
}
.mc-rankup-active .mc-rankup-new {
  animation: mcRankScaleIn 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) 0.4s forwards;
}
@keyframes mcRankScaleIn {
  0% { opacity: 0; transform: scale(0.3); }
  60% { opacity: 1; transform: scale(1.15); }
  100% { opacity: 1; transform: scale(1); }
}
.mc-rankup-label {
  font-size: var(--text-body);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: #fbbf24;
  opacity: 0;
  margin-top: var(--space-1h);
}
.mc-rankup-active .mc-rankup-label {
  animation: mcFadeIn 0.4s ease 0.9s forwards;
}
@keyframes mcFadeIn { to { opacity: 1; } }
.mc-rankup-dismiss { transition: opacity 0.5s ease; opacity: 0 !important; }
.mc-rankup-particles {
  position: absolute;
  inset: -80px;
  pointer-events: none;
}
.mc-rankup-sparkle {
  position: absolute;
  border-radius: 50%;
  background: #fbbf24;
  opacity: 0;
  animation: mcSparkle 1.4s ease-out var(--delay, 0s) forwards;
}
@keyframes mcSparkle {
  0% { opacity: 0; transform: scale(0) translate(0, 0); }
  25% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(0.3) translate(var(--dx, 30px), var(--dy, -40px)); }
}

@media (prefers-reduced-motion: reduce) {
  .mc-heartbeat-ring { animation: none !important; opacity: 0.3; }
  .mc-funnel-particle { display: none; }
  .mc-rankup-active .mc-rankup-new { animation: mcFadeIn 0.3s ease forwards; }
  .mc-rankup-sparkle { display: none; }
  .mc-rankup-flash { display: none; }
}

/* ============================================================================
   Fase 1: Diagnostic preview pre-pago
   ============================================================================ */

.diagnostic-preview {
  margin: 0 0 var(--space-5, 24px) 0;
  padding: var(--space-5, 24px);
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06), rgba(245, 158, 11, 0.06));
  border: 1px solid rgba(245, 158, 11, 0.22);
  border-radius: var(--radius-lg, 14px);
  box-shadow: var(--shadow-glow-gold, 0 0 0 1px rgba(245, 158, 11, 0.18), 0 14px 40px -16px rgba(245, 158, 11, 0.45));
  text-align: left;
  font-size: 0.92rem;
  line-height: 1.45;
}

.diagnostic-preview .dp-headline {
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: var(--space-4, 18px);
  color: var(--gold-strong, #d97706);
  border-bottom: 1px solid rgba(245, 158, 11, 0.22);
  padding-bottom: var(--space-3, 12px);
}

.diagnostic-preview .dp-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3, 12px);
  margin-bottom: var(--space-4, 18px);
}

.diagnostic-preview .dp-section {
  background: rgba(255, 255, 255, 0.04);
  padding: var(--space-3, 12px);
  border-radius: var(--radius-md, 10px);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.diagnostic-preview .dp-section-label {
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-mute-dark, #6b7280);
  margin-bottom: 4px;
  font-weight: 500;
}

.diagnostic-preview .dp-section-value {
  font-size: 0.95rem;
  color: var(--ink-dark, #111827);
  font-weight: 500;
}

.diagnostic-preview .dp-vertical-tag {
  display: inline-block;
  margin-top: 6px;
  font-size: 0.78rem;
  font-weight: 400;
  color: var(--gold-strong, #d97706);
  background: rgba(245, 158, 11, 0.10);
  padding: 2px 8px;
  border-radius: var(--radius-xl, 999px);
}

.diagnostic-preview .dp-list-block {
  margin-bottom: var(--space-4, 18px);
}

.diagnostic-preview .dp-list-title {
  font-size: 0.78rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ink-mute-dark, #6b7280);
  margin-bottom: var(--space-2, 8px);
  font-weight: 600;
}

.diagnostic-preview .dp-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.diagnostic-preview .dp-list li {
  position: relative;
  padding-left: var(--space-4, 18px);
  margin-bottom: 6px;
  font-size: 0.92rem;
  color: var(--ink-dark, #111827);
}

.diagnostic-preview .dp-list-positive .dp-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #16a34a;
  font-weight: 700;
}

.diagnostic-preview .dp-list-risk .dp-list li::before {
  content: "•";
  position: absolute;
  left: 4px;
  color: var(--gold-strong, #d97706);
  font-weight: 700;
  font-size: 1.2em;
  line-height: 1;
}

.diagnostic-preview .dp-list-needs li::before {
  content: "—";
  position: absolute;
  left: 0;
  color: var(--ink-mute-dark, #6b7280);
  font-weight: 600;
}

.diagnostic-preview .dp-reason-block {
  padding: var(--space-3, 12px);
  background: rgba(99, 102, 241, 0.06);
  border-left: 3px solid #6366f1;
  border-radius: 4px;
  margin-bottom: var(--space-4, 18px);
}

.diagnostic-preview .dp-reason-text {
  font-size: 0.94rem;
  color: var(--ink-dark, #111827);
  margin: 0;
  line-height: 1.5;
}

.diagnostic-preview .dp-first-weeks {
  font-size: 0.86rem;
  color: var(--ink-mute-dark, #4b5563);
  margin: var(--space-2, 8px) 0 0 0;
  font-style: italic;
}

.diagnostic-preview .dp-first-weeks-label {
  color: var(--ink-mute-dark, #6b7280);
  font-weight: 600;
  font-style: normal;
}

.diagnostic-preview .dp-not-promised {
  border-top: 1px dashed rgba(0, 0, 0, 0.12);
  padding-top: var(--space-3, 12px);
  margin-top: var(--space-2, 8px);
}

.diagnostic-preview .dp-not-promised-title {
  font-size: 0.74rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-mute-dark, #6b7280);
  margin-bottom: 6px;
  font-weight: 500;
}

.diagnostic-preview .dp-promise-list {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.82rem;
  color: var(--ink-mute-dark, #6b7280);
}

.diagnostic-preview .dp-promise-list li {
  position: relative;
  padding-left: 14px;
  margin-bottom: 3px;
}

.diagnostic-preview .dp-promise-list li::before {
  content: "✕";
  position: absolute;
  left: 0;
  color: rgba(0, 0, 0, 0.32);
}

/* Lite mode: confidence=low */
.diagnostic-preview.dp-lite {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.04), rgba(255, 255, 255, 0.02));
  border-color: rgba(99, 102, 241, 0.18);
  box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.10), 0 12px 32px -16px rgba(99, 102, 241, 0.35);
}

.diagnostic-preview.dp-lite .dp-headline {
  color: #4f46e5;
  border-bottom-color: rgba(99, 102, 241, 0.18);
}

.diagnostic-preview .dp-lite-intro {
  font-size: 0.92rem;
  color: var(--ink-dark, #111827);
  margin: 0 0 var(--space-3, 12px) 0;
}

@media (max-width: 640px) {
  .diagnostic-preview .dp-grid {
    grid-template-columns: 1fr;
  }
  .diagnostic-preview {
    padding: var(--space-4, 18px);
  }
  .diagnostic-preview .dp-headline {
    font-size: 1rem;
  }
}

/* ════════════════════════════════════════════════════════════════════
   Phase 12A — Mobile hardening + payload styles + loading/error UI
   Adds: Execution Map payload (em-*), post-map immediate/educational,
   dp-rgd-* safe wrapping, checkout-price-large (replaces inline font-
   size in index.html), diagnosis-loader overlay, surface-fallback
   error states. Plus mobile overrides at canonical 480 / 420 px.
   No new breakpoints invented; only project tokens reused.
   Block intentionally placed BEFORE the Reality Snapshot section so the
   Phase 6B audit (test_styles_no_important_in_reality_block) only sees
   reality-block CSS, while these mobile overrides still win at runtime
   (later in the cascade than the legacy rules they target).
   ════════════════════════════════════════════════════════════════════ */

/* — Checkout price (replaces inline font-size:2.2rem in index.html) — */
.checkout-price-block {
  text-align: center;
  margin: var(--space-5) 0;
}
.checkout-price-large {
  font-size: clamp(1.5rem, 5vw, 2.2rem);
  font-weight: 700;
  color: #1E3A8A;
  margin: 0 0 var(--space-1);
  letter-spacing: -0.01em;
  word-break: break-word;
}
.checkout-price-note {
  color: #666;
  font-size: var(--text-base);
  margin: 0;
}
.checkout-cta-large {
  margin-top: var(--space-5);
  width: 100%;
  font-size: var(--text-md);
  padding: var(--space-3h) var(--space-3);
  font-weight: 700;
}

/* — Execution Map payload base styles (classes existed in JS without CSS) — */
.em-payload-block {
  display: block;
  max-width: 100%;
  margin-top: var(--space-4h);
}
.em-section {
  margin: var(--space-4) 0 0;
  padding: var(--space-3) 0 0;
  border-top: 1px solid rgba(99, 102, 241, 0.12);
}
.em-section--path { border-top-color: rgba(99, 102, 241, 0.18); }
.em-section--stop { border-top-color: rgba(245, 158, 11, 0.22); }
.em-section--rec  { border-top-color: rgba(15, 157, 116, 0.22); }
.em-section-title {
  margin: 0 0 var(--space-2);
  font-size: var(--text-md);
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -0.005em;
}
.em-week-list {
  margin: 0;
  padding: 0 0 0 var(--space-4h);
  list-style: decimal;
}
.em-week {
  margin: var(--space-2) 0;
  padding: var(--space-1h) var(--space-2h);
  border-left: 3px solid rgba(99, 102, 241, 0.35);
  background: rgba(99, 102, 241, 0.04);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  list-style-position: outside;
}
.em-week-title {
  font-weight: 700;
  color: var(--ink);
  margin-bottom: var(--space-0);
}
.em-week-objective,
.em-week-output {
  margin: var(--space-0) 0 0;
  color: var(--ink-soft);
  font-size: var(--text-body);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.em-week-output em {
  color: var(--ink-mute);
  font-style: italic;
}
.em-stop-list {
  margin: 0;
  padding: 0 0 0 var(--space-4h);
  list-style: disc;
  color: var(--ink-soft);
}
.em-stop-list li {
  margin: var(--space-1) 0;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.em-section--rec p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.55;
  overflow-wrap: anywhere;
}

/* — Post-Map immediate direction + dp-rgd safe wrapping — */
.post-map-immediate-block {
  max-width: 100%;
  margin: 0 auto var(--space-4);
  padding: var(--space-3) 0 0;
}
.post-map-immediate-title {
  margin: 0 0 var(--space-1);
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--ink);
}
.post-map-immediate-subtitle {
  margin: 0 0 var(--space-3);
  color: var(--ink-soft);
  font-size: var(--text-body);
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.dp-rgd-section {
  margin-top: var(--space-3);
}
.dp-rgd-label {
  font-size: var(--text-xs-plus);
  font-weight: 700;
  color: var(--indigo-strong);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: var(--space-0);
}
.dp-rgd-body {
  margin: 0;
  color: var(--ink);
  line-height: 1.55;
  font-size: var(--text-body);
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* — Execution Map Premium Redesign (2026-05-16): badge + ribbon + unlock anim — */
.em-premium-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(79, 70, 229, 0.18);
  box-shadow: 0 4px 20px rgba(55, 48, 163, 0.08), 0 2px 4px rgba(79, 70, 229, 0.05);
}
.em-premium-header {
  background: linear-gradient(135deg, #3730a3 0%, #4f46e5 45%, #b48e32 100%);
  padding: 18px 24px 22px;
  text-align: center;
  margin: -1.5rem -1.5rem 1rem -1.5rem;
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  position: relative;
}
/* El badge + título + subtítulo viven todos sobre el gradient: el color cubre
   el encabezado completo, no solo la franja del badge. */
.em-premium-header .em-premium-badge { margin-bottom: 12px; }
.em-premium-header::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, #fbbf24 50%, transparent 100%);
}
.em-premium-badge {
  display: inline-block;
  background: rgba(255, 255, 255, 0.18);
  color: #fef3c7;
  font-size: 11px;
  letter-spacing: 1.8px;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 999px;
  text-transform: uppercase;
  border: 1px solid rgba(254, 243, 199, 0.3);
}
.em-premium-card-header {
  animation: em-unlock-anim 600ms cubic-bezier(0.16, 1, 0.3, 1);
}
.em-premium-title {
  color: #ffffff;
  font-weight: 700;
  font-size: 1.6rem;
  margin: 0;
}
.em-premium-subtitle {
  color: #e0e7ff;
  margin: 6px 0 0 0;
}
@keyframes em-unlock-anim {
  0% {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes spin {
  to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .em-premium-card-header { animation: none; }
}
@media (max-width: 640px) {
  .em-premium-header { padding: 14px 16px 18px; margin: -1rem -1rem 0.8rem -1rem; }
  .em-premium-badge { font-size: 10px; letter-spacing: 1.3px; padding: 4px 10px; }
  .em-premium-title { font-size: 1.3rem; }
}

/* — Execution Map Premium Redesign: Reality Check + Failure Traps blocks (2026-05-16) — */
.mdt-block--reality-check {
  background: linear-gradient(135deg, rgba(79, 70, 229, 0.04) 0%, rgba(180, 142, 50, 0.04) 100%);
  border-left: 4px solid #4f46e5;
  padding: 1rem 1.2rem;
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  margin: 1rem 0;
}
.mdt-reality-intro {
  color: #6b7280;
  font-size: 0.85rem;
  margin-bottom: 0.7rem;
  font-style: italic;
}
.mdt-reality-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mdt-reality-item {
  padding: 0.8rem 0;
  border-top: 1px dashed rgba(79, 70, 229, 0.15);
}
.mdt-reality-item:first-child { border-top: none; }
.mdt-reality-said { color: #1f2937; font-size: 0.9rem; font-weight: 600; margin-bottom: 0.35rem; }
.mdt-reality-data { color: #b45309; font-size: 0.88rem; margin-bottom: 0.3rem; }
.mdt-reality-implication { color: #4b5563; font-size: 0.85rem; font-style: italic; line-height: 1.5; }
.mdt-reality-week-tag {
  display: inline-block;
  margin-top: 0.45rem;
  padding: 2px 8px;
  background: rgba(79, 70, 229, 0.1);
  color: #3730a3;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
}
.mdt-reality-caveat {
  margin-top: 0.8rem;
  padding-top: 0.7rem;
  border-top: 1px solid rgba(79, 70, 229, 0.12);
  color: #6b7280;
  font-size: 0.8rem;
  font-style: italic;
}

.mdt-block--failure-traps {
  background: rgba(217, 119, 6, 0.04);
  border-left: 4px solid #d97706;
  padding: 1rem 1.2rem;
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  margin: 1.2rem 0 0.6rem 0;
}
.mdt-traps-label {
  color: #92400e;
}
.mdt-traps-intro {
  color: #78716c;
  font-size: 0.85rem;
  margin-bottom: 0.8rem;
  font-style: italic;
}
.mdt-traps-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mdt-trap-item {
  padding: 0.7rem 0;
  border-top: 1px dashed rgba(217, 119, 6, 0.18);
}
.mdt-trap-item:first-child { border-top: none; }
.mdt-trap-title { color: #92400e; font-weight: 600; font-size: 0.92rem; margin-bottom: 0.3rem; }
.mdt-trap-quote { color: #78716c; font-style: italic; font-size: 0.85rem; margin-bottom: 0.3rem; }
.mdt-trap-implication { color: #57534e; font-size: 0.85rem; line-height: 1.5; margin-bottom: 0.3rem; }
.mdt-trap-correction { color: #15803d; font-size: 0.85rem; line-height: 1.5; }
.mdt-trap-correction strong { color: #166534; }
.mdt-trap-week-tag {
  display: inline-block;
  margin-top: 0.4rem;
  padding: 2px 8px;
  background: rgba(217, 119, 6, 0.12);
  color: #92400e;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 600;
}

/* — Post-Map educational pair (Map vs Sprint, About Momentum) — */
.post-map-education {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3h);
  margin: var(--space-4) 0;
}
.post-map-edu-block {
  padding: var(--space-3) var(--space-3h);
  background: rgba(37, 99, 235, 0.04);
  border: 1px solid rgba(37, 99, 235, 0.10);
  border-radius: var(--radius-md);
}
.post-map-edu-block h4 {
  margin: 0 0 var(--space-1);
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--ink);
}
.post-map-edu-block p {
  margin: 0;
  color: var(--ink-soft);
  font-size: var(--text-body);
  line-height: 1.55;
  overflow-wrap: anywhere;
}

/* — Diagnosis loading overlay (Phase 12A — Part 2) — */
.diagnosis-loader {
  margin: var(--space-4) auto;
  padding: var(--space-5) var(--space-4h);
  max-width: 480px;
  background: var(--surface);
  border: 1px solid rgba(99, 102, 241, 0.18);
  border-radius: var(--radius-lg);
  box-shadow: 0 12px 32px -10px rgba(15, 10, 46, 0.18);
  text-align: center;
}
.diagnosis-loader-spinner {
  width: 36px;
  height: 36px;
  margin: 0 auto var(--space-3);
  border-radius: 50%;
  border: 3px solid rgba(99, 102, 241, 0.18);
  border-top-color: var(--indigo);
  animation: diagnosisLoaderSpin 0.9s linear infinite;
}
@keyframes diagnosisLoaderSpin {
  to { transform: rotate(360deg); }
}
.diagnosis-loader-title {
  margin: 0 0 var(--space-1);
  font-size: var(--text-lg);
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -0.01em;
}
.diagnosis-loader-subtitle {
  margin: 0;
  color: var(--ink-soft);
  font-size: var(--text-body);
  line-height: 1.55;
}

/* — Failure state surfaces (Phase 12A — Part 3) — */
.surface-fallback {
  margin: var(--space-3) 0;
  padding: var(--space-3) var(--space-3h);
  background: rgba(245, 158, 11, 0.06);
  border: 1px solid rgba(245, 158, 11, 0.20);
  border-radius: var(--radius-md);
  color: var(--ink-soft);
  font-size: var(--text-body);
  line-height: 1.55;
  overflow-wrap: anywhere;
}
.surface-fallback--neutral {
  background: rgba(11, 20, 48, 0.04);
  border-color: rgba(11, 20, 48, 0.10);
}
.surface-fallback p {
  margin: 0 0 var(--space-2);
}
.surface-fallback p:last-child {
  margin-bottom: 0;
}
.surface-fallback-actions {
  margin-top: var(--space-2);
  display: flex;
  gap: var(--space-2);
  flex-wrap: wrap;
}
.surface-fallback-actions .btn-primario,
.surface-fallback-actions .btn-secundario {
  flex: 1 1 auto;
  min-width: 120px;
}

/* — Mobile overrides (≤480px) — covers 375 / 390 / 430 / 479 — */
@media (max-width: 480px) {
  /* Value ladder cards: tighter padding, full-width CTAs */
  .entry-options-row,
  .entry-options-3col,
  .entry-options-4col {
    gap: var(--space-3);
    max-width: 100%;
  }
  .entry-option-card {
    padding: var(--space-3h) var(--space-3);
  }
  .entry-option-title {
    font-size: var(--text-lg);
  }
  .entry-option-desc {
    font-size: var(--text-body);
    line-height: 1.55;
  }
  .entry-option-price {
    font-size: 1.45rem;
  }
  .entry-option-cta {
    display: block;
    width: 100%;
    padding: var(--space-3) var(--space-3h);
  }

  /* Wizard quick: trim padding further; ensure number badges remain legible.
     !important is required to defeat the legacy `.wizard-quick { padding: ... !important }`
     declared at the wizard-quick base + the legacy 480px override above. */
  .wizard-quick {
    padding: var(--space-4) var(--space-3) !important;
  }
  .wizard-quick-label::before {
    width: 26px;
    height: 26px;
    font-size: var(--text-sm);
  }

  /* Post-Map educational pair stacks vertically */
  .post-map-education {
    grid-template-columns: 1fr;
    gap: var(--space-2h);
  }

  /* Execution Map payload tighter spacing + reduced indent */
  .em-week-list,
  .em-stop-list {
    padding-left: var(--space-4);
  }
  .em-week {
    padding: var(--space-1h) var(--space-2);
  }

  /* Surface fallback actions stack on small */
  .surface-fallback-actions {
    flex-direction: column;
  }
  .surface-fallback-actions .btn-primario,
  .surface-fallback-actions .btn-secundario {
    width: 100%;
  }
}

/* — Mobile overrides (≤420px) — gradient text fallback for legibility.
   Source order alone wins over the base gradient declarations at lines
   3804 / 3829 (no !important needed — they are non-!important rules). */
@media (max-width: 420px) {
  .entry-option-map .entry-option-price {
    background: none;
    -webkit-text-fill-color: var(--indigo);
    color: var(--indigo);
  }
  .entry-option-momentum .entry-option-price {
    background: none;
    -webkit-text-fill-color: var(--gold-strong);
    color: var(--gold-strong);
  }
  .entry-option-card {
    padding: var(--space-3) var(--space-2h);
  }
  .entry-option-title {
    font-size: var(--text-md);
  }
  .checkout-price-large {
    font-size: 1.4rem;
  }
  .em-week-objective,
  .em-week-output,
  .em-stop-list li,
  .dp-rgd-body,
  .post-map-edu-block p {
    font-size: var(--text-sm);
  }
}

/* ════════════════════════════════════════════════════════════════════
   Phase 12B — Questionnaire quality + value perception
   Adds: optional-field hint chip, em-personalization-note (post-Map
   intro that connects path with user reality), dp-rgd-divergence
   premium callout (only when perceived ≠ actual). Block intentionally
   placed BEFORE the Reality Snapshot section so the Phase 6B audit
   (test_styles_no_important_in_reality_block) keeps seeing only
   reality-block CSS. No !important; pure source-order overrides.
   ════════════════════════════════════════════════════════════════════ */

.wizard-field-optional {
  margin-left: var(--space-1);
  font-size: var(--text-xs-plus);
  font-weight: var(--weight-regular);
  color: var(--ink-mute);
  text-transform: none;
  letter-spacing: 0;
}

.em-personalization-note {
  margin: var(--space-3) 0 var(--space-4);
  padding: var(--space-2h) var(--space-3h);
  background: rgba(99, 102, 241, 0.06);
  border-left: 3px solid rgba(99, 102, 241, 0.4);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: var(--ink-soft);
  font-size: var(--text-body);
  line-height: 1.55;
  font-style: italic;
  overflow-wrap: anywhere;
}

.dp-rgd-divergence {
  margin-top: var(--space-3);
  padding: var(--space-2h) var(--space-3h);
  background: rgba(245, 158, 11, 0.07);
  border-left: 3px solid rgba(245, 158, 11, 0.5);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.dp-rgd-divergence .dp-rgd-label {
  color: var(--gold-strong);
  margin-bottom: var(--space-1);
}
.dp-rgd-divergence .dp-rgd-body {
  color: var(--ink);
  font-weight: var(--weight-medium);
  overflow-wrap: anywhere;
}

@media (max-width: 480px) {
  .em-personalization-note,
  .dp-rgd-divergence {
    padding: var(--space-2) var(--space-2h);
  }
  .em-personalization-note {
    font-size: var(--text-sm);
  }
  /* Phase 12C — tighten post-Map vertical density on mobile.
     The post-Map screen stacks: header → immediate (RGD + divergence +
     priority + recommended path) → reality anchors → em-payload (path +
     stop-doing + recommendation) → educational pair → credit + PDF + CTAs.
     On 375-430px this becomes a long scroll. We keep ALL sections visible
     (no collapsing) and only reduce gaps between sections so the page
     reads tighter without losing premium spacing. */
  .em-payload-block {
    margin-top: var(--space-3);
  }
  .em-section {
    margin: var(--space-3) 0 0;
    padding: var(--space-2h) 0 0;
  }
  .post-map-immediate-block {
    margin-bottom: var(--space-3);
    padding-top: var(--space-2);
  }
  .post-map-immediate-subtitle {
    margin-bottom: var(--space-2);
  }
  .dp-rgd-section {
    margin-top: var(--space-2h);
  }
}

/* ════════════════════════════════════════════════════════════════════
   Phase 13C — Map week-context blurb (frontend-only personalization).
   Renders below each week of the four_week_path in the Map payload.
   Universal copy by bottleneck (no vertical-specific variants — that's
   Phase 13E). Italic + indigo border-left to feel premium without
   competing with the week title. Block placed BEFORE Reality Snapshot
   Phase 6B marker so test_styles_no_important_in_reality_block keeps
   passing — same pattern as Phase 12A/12B/13.
   ════════════════════════════════════════════════════════════════════ */
.em-week-context {
  margin: var(--space-1h) 0 var(--space-2);
  padding: var(--space-1h) var(--space-2h);
  background: rgba(99, 102, 241, 0.04);
  border-left: 2px solid rgba(99, 102, 241, 0.28);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: var(--ink-soft);
  font-size: var(--text-sm);
  line-height: 1.5;
  font-style: italic;
  overflow-wrap: anywhere;
}
@media (max-width: 480px) {
  .em-week-context {
    padding: var(--space-1) var(--space-2);
    font-size: var(--text-xs-plus);
    margin: var(--space-1) 0 var(--space-1h);
  }
}

/* === Reality Snapshot card (Phase 6B) ===
 * Premium personalization block emitted by _renderRealityAnchorsBlock in
 * frontend/static/script.js. Scopes: "free" (Free Diagnosis) and "post_map"
 * (Execution Map payload). Goal: make the user feel the engine reflected
 * THEIR answers, not a template. Surface-tinted card + anchor chips on a
 * responsive auto-fit grid. Stage anchor spans full width as a soft tag.
 * All values pass through escapeHtml in JS — no XSS surface here.
 */
.reality-block {
  position: relative;
  margin: var(--space-4) 0;
  padding: var(--space-4) var(--space-4h);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  color: var(--ink);
  text-align: left;
  overflow: hidden;
}

.reality-block--free {
  background: linear-gradient(135deg, var(--surface) 0%, var(--gold-soft) 140%);
  border-color: rgba(245, 158, 11, 0.18);
}

.reality-block--post_map {
  background: linear-gradient(135deg, var(--surface) 0%, rgba(99, 102, 241, 0.05) 140%);
  border-color: rgba(99, 102, 241, 0.16);
}

.reality-block .reality-title {
  font-size: var(--text-xs-plus);
  font-weight: var(--weight-semi);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-mute);
  border-bottom: 1px solid var(--line-soft);
  padding-bottom: var(--space-1h);
  margin: 0 0 var(--space-2) 0;
}

.reality-block .reality-subtitle {
  font-size: var(--text-sm);
  color: var(--ink-soft);
  line-height: 1.5;
  margin: 0 0 var(--space-3) 0;
}

.reality-block .reality-anchors {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--space-2);
  list-style: none;
  padding: 0;
  margin: 0;
}

.reality-block .reality-anchor {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  padding: var(--space-2) var(--space-2h);
  background: var(--surface-tint);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.reality-block .reality-anchor-label {
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: var(--weight-medium);
  color: var(--ink-mute);
}

.reality-block .reality-anchor-value {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--ink);
  line-height: 1.4;
}

.reality-block .reality-anchor--stage {
  grid-column: 1 / -1;
  background: var(--gold-soft);
  border-color: rgba(245, 158, 11, 0.22);
  align-items: flex-start;
}

.reality-block .reality-anchor--stage .reality-anchor-value {
  color: var(--gold-strong);
  font-weight: var(--weight-semi);
}

@media (max-width: 640px) {
  .reality-block {
    padding: var(--space-3) var(--space-3h);
  }
  .reality-block .reality-anchors {
    grid-template-columns: 1fr;
  }
}

/* =====================================================================
   Premium free diagnosis cards (LLM enrichment)
   ===================================================================== */

.dp-premium {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.auth-helper-note {
  background: var(--surface-tint);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-3h);
  color: var(--ink);
  font-size: var(--text-body);
  line-height: 1.55;
}

.auth-helper-note .dp-section-label {
  font-weight: var(--weight-semi);
  margin-bottom: var(--space-1);
  letter-spacing: -0.005em;
}

/* =====================================================================
   Execution Map deliverable (LLM 4-week roadmap rendering)
   ===================================================================== */

.em-section--path-llm {
  border-top-color: var(--primary-soft);
}

.em-week-list--llm {
  list-style: none;
  padding-left: 0;
}

.em-week--llm {
  margin: var(--space-3) 0;
  padding: var(--space-3) var(--space-3h);
  border: 1px solid var(--line);
  border-left: 3px solid var(--primary-strong);
  border-radius: var(--radius-md);
  background: var(--surface-tint);
}

.em-week--llm .em-week-title {
  color: var(--primary-strong);
  font-size: var(--text-md);
  font-weight: var(--weight-semi);
  margin-bottom: var(--space-1h);
  letter-spacing: -0.005em;
}

.em-week--llm .em-week-why {
  margin: var(--space-1) 0;
  color: var(--ink);
  line-height: 1.5;
}

.em-week--llm .em-week-tasks {
  margin: var(--space-1) 0 var(--space-1h) var(--space-4);
  padding: 0;
  color: var(--ink-soft);
  font-size: var(--text-body);
}

.em-week--llm .em-week-tasks li {
  margin: var(--space-0) 0;
}

.em-week--llm .em-week-metric {
  margin: var(--space-1h) 0 0 0;
  color: var(--ink-mute);
  font-style: italic;
  font-size: var(--text-sm);
}

/* ============================================================================
   Free Value Layer — 3-act Strategic Mirror (Fase 2 Free+Map Conversion Proof)
   Premium theme: indigo + warm-gold accents, sequential reveal, mobile-first.
   ============================================================================ */
.flv-root {
  margin: 1.5rem 0;
  padding: 0;
  color: #111827;
  font-feature-settings: "ss01" on, "ss02" on;
}

/* Confidence pill (top, always visible) */
.flv-conf-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.85rem;
  margin-bottom: 1.2rem;
  background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 100%);
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 500;
  color: #3730a3;
}
.flv-conf-pill-label {
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.72rem;
  color: #6366f1;
  font-weight: 700;
}
.flv-conf-pill-value { font-weight: 600; }
.flv-conf-pill--low { background: linear-gradient(135deg, #fef3c7 0%, #fee2e2 100%); border-color: #fcd34d; color: #92400e; }
.flv-conf-pill--low .flv-conf-pill-label { color: #b45309; }
.flv-conf-pill--medium { background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 100%); border-color: #c7d2fe; color: #3730a3; }
.flv-conf-pill--high { background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%); border-color: #6ee7b7; color: #065f46; }
.flv-conf-pill--high .flv-conf-pill-label { color: #047857; }
.flv-conf-pill-details {
  display: inline-block;
  margin-left: 0.35rem;
}
.flv-conf-pill-details summary {
  cursor: pointer;
  list-style: none;
  font-size: 0.78rem;
  color: #6366f1;
  font-weight: 600;
}
.flv-conf-pill-details summary::-webkit-details-marker { display: none; }
.flv-conf-pill-details summary::before { content: "▾ "; font-size: 0.7rem; }
.flv-conf-pill-details[open] summary::before { content: "▴ "; }
.flv-conf-pill-list {
  list-style: none;
  margin: 0.6rem 0 0;
  padding: 0.6rem 0.75rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  min-width: 200px;
}
.flv-conf-pill-list li {
  display: grid;
  grid-template-columns: 5.5rem 2.2rem 1fr;
  align-items: center;
  gap: 0.4rem;
  padding: 0.18rem 0;
  font-size: 0.78rem;
  color: #374151;
}
.flv-conf-pill-pct { font-weight: 600; color: #111827; text-align: right; }
.flv-conf-pill-bar {
  display: block;
  height: 4px;
  background: #e5e7eb;
  border-radius: 999px;
  overflow: hidden;
}
.flv-conf-pill-bar-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #6366f1 0%, #8b5cf6 100%);
  border-radius: 999px;
}

/* Acts */
.flv-act {
  margin: 0 0 2rem;
  padding: 1.5rem 1.25rem 1.25rem;
  background: #ffffff;
  border-radius: 14px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 2px rgba(17,24,39,0.04);
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 600ms cubic-bezier(0.16,1,0.3,1), transform 600ms cubic-bezier(0.16,1,0.3,1);
}
.flv-act--revealed { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .flv-act {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

.flv-act-header {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  margin-bottom: 1rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid #f3f4f6;
}
.flv-act-num {
  flex: 0 0 36px;
  height: 36px;
  width: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #4f46e5 0%, #3730a3 100%);
  color: #fef3c7;
  font-weight: 700;
  font-size: 1.05rem;
  border-radius: 50%;
  box-shadow: 0 2px 5px rgba(67,56,202,0.25);
}
.flv-act-title {
  font-size: 1.18rem;
  font-weight: 700;
  color: #111827;
  line-height: 1.25;
}
.flv-act-subtitle {
  font-size: 0.88rem;
  color: #6b7280;
  margin-top: 0.15rem;
}

.flv-act--1 .flv-act-num { background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%); }
.flv-act--2 .flv-act-num { background: linear-gradient(135deg, #d97706 0%, #b45309 100%); }
.flv-act--3 .flv-act-num { background: linear-gradient(135deg, #047857 0%, #065f46 100%); }

.flv-act-block {
  margin: 0 0 1.1rem;
}
.flv-act-block:last-child { margin-bottom: 0; }

/* --- Acto 1 --- */
.flv-understood-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.flv-understood-item {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.45rem 0;
  font-size: 0.96rem;
  color: #1f2937;
  line-height: 1.55;
}
.flv-understood-bullet {
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  margin-top: 0.55rem;
  background: #4f46e5;
  border-radius: 50%;
}
.flv-understood-text { font-weight: 500; }

.flv-gap {
  margin-top: 1.2rem;
  padding: 1rem;
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border: 1px solid #fcd34d;
  border-radius: 10px;
}
.flv-gap-title {
  font-weight: 700;
  font-size: 0.98rem;
  color: #92400e;
  margin-bottom: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.flv-gap-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.7rem;
}
.flv-gap-cell {
  padding: 0.7rem 0.8rem;
  background: rgba(255,255,255,0.7);
  border-radius: 8px;
  border: 1px solid rgba(217,119,6,0.18);
}
.flv-gap-cell--cost { grid-column: span 2; background: rgba(255,251,235,0.95); }
.flv-gap-cell-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #b45309;
  font-weight: 700;
  margin-bottom: 0.25rem;
}
.flv-gap-cell-body {
  color: #78350f;
  font-size: 0.92rem;
  line-height: 1.5;
}
.flv-gap-cell--actual .flv-gap-cell-label { color: #92400e; }
.flv-gap-cell--actual { border-color: #d97706; background: rgba(255,255,255,0.95); }
.flv-gap-whynow {
  margin-top: 0.7rem;
  padding: 0.55rem 0.75rem;
  background: rgba(217,119,6,0.08);
  border-left: 3px solid #d97706;
  border-radius: 4px;
  font-size: 0.88rem;
  color: #78350f;
  font-style: italic;
}

/* --- Acto 2 --- */
.flv-trap {
  padding: 1rem;
  background: #faf5ff;
  border: 1px solid #d8b4fe;
  border-radius: 10px;
}
.flv-trap-title {
  font-weight: 700;
  font-size: 1rem;
  color: #6b21a8;
  margin-bottom: 0.6rem;
}
.flv-trap-intro {
  font-size: 0.82rem;
  color: #7e22ce;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0.6rem 0 0.3rem;
}
.flv-trap-generic {
  margin: 0;
  padding: 0.6rem 0.8rem;
  background: #ffffff;
  border-left: 3px solid #a78bfa;
  font-style: italic;
  color: #6b21a8;
  font-size: 0.94rem;
  border-radius: 4px;
}
.flv-trap-ours {
  margin: 0;
  padding: 0.6rem 0.8rem;
  background: #ffffff;
  border-left: 3px solid #6d28d9;
  color: #4c1d95;
  font-weight: 500;
  font-size: 0.95rem;
  border-radius: 4px;
}

/* v2 Mejora #3: user_quote literal del intake. Visualmente PROMINENTE para
   que el contraste personal sea inevitable de leer. */
.flv-trap-intro--personal {
  color: #6d28d9 !important;
  font-weight: 700;
}
.flv-trap-user-quote {
  margin: 0;
  padding: 0.85rem 1rem;
  background: linear-gradient(135deg, #ffffff 0%, #faf5ff 100%);
  border-left: 4px solid #6d28d9;
  border-top: 1px solid rgba(109,40,217,0.18);
  border-right: 1px solid rgba(109,40,217,0.12);
  border-bottom: 1px solid rgba(109,40,217,0.12);
  border-radius: 6px;
  color: #2e1065;
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.55;
  font-style: italic;
  box-shadow: 0 1px 3px rgba(109,40,217,0.08);
  position: relative;
}
.flv-trap-user-quote::before {
  content: "\201C";
  position: absolute;
  top: -0.2rem;
  left: 0.4rem;
  font-size: 2.2rem;
  color: rgba(109,40,217,0.32);
  font-family: Georgia, serif;
  line-height: 1;
}
.flv-trap-user-quote::after {
  content: "\201D";
  position: absolute;
  bottom: -0.55rem;
  right: 0.6rem;
  font-size: 2.2rem;
  color: rgba(109,40,217,0.32);
  font-family: Georgia, serif;
  line-height: 1;
}
@media (max-width: 480px) {
  .flv-trap-user-quote {
    font-size: 0.94rem;
    padding: 0.7rem 0.85rem;
  }
}
.flv-trap-refs {
  margin-top: 0.8rem;
  padding-top: 0.6rem;
  border-top: 1px dashed #d8b4fe;
  font-size: 0.82rem;
}
.flv-trap-refs-label {
  display: inline-block;
  font-weight: 600;
  color: #6b21a8;
  margin-bottom: 0.3rem;
}
.flv-trap-refs-list {
  list-style: disc;
  padding-left: 1.25rem;
  color: #4c1d95;
}
.flv-trap-refs-list li { padding: 0.1rem 0; }

.flv-intel {
  margin-top: 1.1rem;
  padding: 1rem;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
}
.flv-intel-title {
  font-weight: 700;
  font-size: 1rem;
  color: #3730a3;
  margin-bottom: 0.25rem;
}
.flv-intel-subtitle {
  font-size: 0.85rem;
  color: #4338ca;
  margin-bottom: 0.85rem;
  font-style: italic;
}
.flv-intel-grid {
  display: grid;
  grid-template-columns: minmax(120px, 0.45fr) 1fr;
  gap: 0.55rem 0.85rem;
  margin: 0;
}
.flv-intel-grid dt {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: #4338ca;
  padding-top: 0.2rem;
}
.flv-intel-grid dd {
  margin: 0;
  font-size: 0.92rem;
  color: #1e1b4b;
  line-height: 1.5;
}
.flv-intel-first-test {
  background: #ffffff;
  padding: 0.65rem 0.8rem;
  border-radius: 8px;
  border: 1px solid #c7d2fe;
}
.flv-intel-first-test-action {
  font-weight: 600;
  color: #312e81;
  margin-bottom: 0.45rem;
}
.flv-intel-first-test-line {
  font-size: 0.85rem;
  color: #3730a3;
  padding: 0.15rem 0;
}
.flv-intel-first-test-line strong { color: #4338ca; font-weight: 600; }
.flv-intel-first-test-line--fail { color: #991b1b; }
.flv-intel-first-test-line--fail strong { color: #b91c1c; }
.flv-intel-next-branch {
  font-size: 0.88rem;
  padding: 0.32rem 0;
  border-bottom: 1px dashed #c7d2fe;
}
.flv-intel-next-branch:last-child { border-bottom: none; }
.flv-intel-next-branch--success { color: #065f46; }
.flv-intel-next-branch--success strong { color: #047857; }
.flv-intel-next-branch--failure { color: #991b1b; }
.flv-intel-next-branch--failure strong { color: #b91c1c; }
.flv-intel-next-branch--unclear { color: #6b21a8; }
.flv-intel-next-branch--unclear strong { color: #7e22ce; }

/* --- Acto 3 --- */
.flv-firstmove {
  padding: 1.1rem;
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  border: 1px solid #6ee7b7;
  border-radius: 12px;
}
.flv-firstmove-action-row {
  margin-bottom: 0.8rem;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid rgba(5,150,105,0.2);
}
.flv-firstmove-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: #047857;
  margin-bottom: 0.35rem;
}
.flv-firstmove-action {
  font-size: 1.08rem;
  font-weight: 600;
  color: #064e3b;
  line-height: 1.45;
}
.flv-firstmove-row {
  display: grid;
  grid-template-columns: minmax(100px, 0.32fr) 1fr;
  gap: 0.6rem;
  padding: 0.42rem 0;
  font-size: 0.92rem;
  color: #065f46;
  align-items: baseline;
}
.flv-firstmove-row-label {
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: #047857;
}
.flv-firstmove-row-text { color: #064e3b; line-height: 1.5; }
.flv-firstmove-row--whatnot { background: rgba(244,63,94,0.06); border-radius: 8px; padding: 0.55rem 0.6rem; margin-top: 0.4rem; }
.flv-firstmove-row--whatnot .flv-firstmove-row-label { color: #be123c; }
.flv-firstmove-row--whatnot .flv-firstmove-row-text { color: #881337; }
.flv-firstmove-caveat {
  margin-top: 0.7rem;
  padding: 0.45rem 0.65rem;
  background: rgba(217,119,6,0.1);
  border-left: 3px solid #d97706;
  border-radius: 4px;
  font-size: 0.84rem;
  color: #92400e;
  font-style: italic;
}

.flv-path {
  margin-top: 1rem;
  padding: 0.9rem 1rem;
  background: #f8fafc;
  border-left: 4px solid #4f46e5;
  border-radius: 6px;
}
.flv-path-title {
  font-weight: 700;
  color: #1e1b4b;
  margin-bottom: 0.4rem;
}
.flv-path-narrative { margin: 0 0 0.5rem; color: #1f2937; font-size: 0.94rem; line-height: 1.55; }
.flv-path-whynot { margin: 0; color: #6b7280; font-size: 0.86rem; font-style: italic; }
.flv-path-confidence { margin-top: 0.6rem; font-size: 0.82rem; color: #4338ca; }

.flv-plateau {
  margin-top: 1rem;
  padding: 0.95rem;
  background: #fff7ed;
  border: 1px solid #fdba74;
  border-radius: 10px;
}
.flv-plateau-title {
  font-weight: 700;
  color: #9a3412;
  font-size: 0.98rem;
  margin-bottom: 0.6rem;
}
.flv-plateau-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.6rem;
  margin-bottom: 0.6rem;
}
.flv-plateau-cell {
  background: rgba(255,255,255,0.6);
  padding: 0.55rem 0.7rem;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.flv-plateau-cell-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: #c2410c;
}
.flv-plateau-cell-value {
  font-size: 1rem;
  font-weight: 600;
  color: #7c2d12;
}
.flv-plateau-signal, .flv-plateau-playbook {
  margin: 0.35rem 0;
  font-size: 0.9rem;
  color: #7c2d12;
  line-height: 1.5;
}
.flv-plateau-available {
  margin-top: 0.6rem;
  padding: 0.4rem 0.6rem;
  background: rgba(154,52,18,0.08);
  border-radius: 4px;
  font-size: 0.84rem;
  color: #9a3412;
  font-weight: 600;
}

.flv-vertical {
  margin-top: 1rem;
  padding: 0.95rem;
  background: #f5f3ff;
  border: 1px solid #c4b5fd;
  border-radius: 10px;
}
.flv-vertical-title {
  font-weight: 700;
  color: #5b21b6;
  font-size: 0.98rem;
  margin-bottom: 0.2rem;
}
.flv-vertical-subtitle {
  font-size: 0.84rem;
  color: #6d28d9;
  margin-bottom: 0.55rem;
  font-style: italic;
}
.flv-vertical-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.35rem;
}
.flv-vertical-list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 0.45rem 0.6rem;
  background: rgba(255,255,255,0.65);
  border-radius: 6px;
}
.flv-vertical-metric { font-size: 0.88rem; color: #4c1d95; }
.flv-vertical-value { font-weight: 700; color: #5b21b6; }
.flv-vertical-disclaimer {
  margin-top: 0.5rem;
  font-size: 0.78rem;
  color: #6d28d9;
  font-style: italic;
}

.flv-proof {
  margin-top: 1rem;
  padding: 0.9rem 1rem;
  background: linear-gradient(180deg, #ffffff 0%, #f9fafb 100%);
  border: 1px solid #d1d5db;
  border-radius: 10px;
}
.flv-proof-title {
  font-weight: 700;
  color: #111827;
  font-size: 0.98rem;
  margin-bottom: 0.6rem;
}
.flv-proof-row {
  display: grid;
  grid-template-columns: minmax(90px, 0.25fr) 1fr;
  gap: 0.7rem;
  padding: 0.55rem 0;
  font-size: 0.92rem;
  align-items: baseline;
}
.flv-proof-row + .flv-proof-row { border-top: 1px dashed #e5e7eb; }
.flv-proof-row-label {
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
}
.flv-proof-row-text { color: #1f2937; line-height: 1.5; }
.flv-proof-row--generic .flv-proof-row-label { color: #9ca3af; }
.flv-proof-row--generic .flv-proof-row-text { color: #6b7280; font-style: italic; }
.flv-proof-row--ours .flv-proof-row-label { color: #4338ca; }
.flv-proof-row--ours .flv-proof-row-text { color: #1e1b4b; font-weight: 500; }

/* --- Mobile (640px y abajo) --- */
@media (max-width: 640px) {
  .flv-act {
    padding: 1.1rem 0.95rem 1rem;
    margin-bottom: 1.4rem;
    border-radius: 12px;
  }
  .flv-act-header {
    gap: 0.7rem;
    margin-bottom: 0.85rem;
  }
  .flv-act-num {
    flex: 0 0 30px;
    height: 30px;
    width: 30px;
    font-size: 0.95rem;
  }
  .flv-act-title { font-size: 1.05rem; }
  .flv-act-subtitle { font-size: 0.82rem; }
  .flv-gap-grid { grid-template-columns: 1fr; gap: 0.55rem; }
  .flv-gap-cell--cost { grid-column: span 1; }
  .flv-intel-grid { grid-template-columns: 1fr; gap: 0.25rem 0; }
  .flv-intel-grid dt { padding-top: 0.5rem; }
  .flv-firstmove-row { grid-template-columns: 1fr; gap: 0.2rem; }
  .flv-firstmove-row-label { font-size: 0.7rem; }
  .flv-plateau-grid { grid-template-columns: 1fr; }
  .flv-proof-row { grid-template-columns: 1fr; gap: 0.15rem; }
}

@media (max-width: 480px) {
  .flv-act { padding: 0.95rem 0.8rem 0.85rem; }
  .flv-act-title { font-size: 1rem; }
  .flv-understood-item { font-size: 0.9rem; }
  .flv-firstmove-action { font-size: 1rem; }
  .flv-conf-pill { font-size: 0.78rem; padding: 0.35rem 0.7rem; }
  .flv-conf-pill-list { min-width: 170px; }
}

/* v2 Mejora #4 — Free conversacional: check de resonancia por acto. */
.flv-act-check {
  margin-top: 1.2rem;
  padding: 0.9rem 1rem;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  border-left: 3px solid #6366f1;
}
.flv-act-check-question {
  font-size: 0.94rem;
  font-weight: 600;
  color: #1e1b4b;
  margin-bottom: 0.65rem;
}
.flv-act-check-actions {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
}
.flv-act-check-btn {
  padding: 0.45rem 0.9rem;
  font-size: 0.85rem;
  font-weight: 600;
  border-radius: 999px;
  border: 1px solid #c7d2fe;
  background: #ffffff;
  color: #4338ca;
  cursor: pointer;
  transition: background 150ms ease, color 150ms ease, border-color 150ms ease, transform 100ms ease;
}
.flv-act-check-btn:hover {
  background: #eef2ff;
  transform: translateY(-1px);
}
.flv-act-check-btn--yes.is-selected {
  background: #d1fae5;
  color: #065f46;
  border-color: #6ee7b7;
}
.flv-act-check-btn--partial.is-selected {
  background: #fef3c7;
  color: #92400e;
  border-color: #fcd34d;
}
.flv-act-check-btn--no.is-selected {
  background: #fee2e2;
  color: #991b1b;
  border-color: #fca5a5;
}
.flv-act-check-textarea-wrap {
  margin-top: 0.7rem;
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  align-items: stretch;
  max-height: 200px;
  opacity: 1;
}
.flv-act-check-textarea {
  flex: 1 1 auto;
  min-width: 200px;
  border: 1px solid #c7d2fe;
  border-radius: 8px;
  padding: 0.55rem 0.7rem;
  font-size: 0.9rem;
  color: #1f2937;
  background: #ffffff;
  font-family: inherit;
  resize: vertical;
}
.flv-act-check-textarea:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 2px rgba(99,102,241,0.18);
}
.flv-act-check-textarea-submit {
  background: linear-gradient(135deg, #4f46e5 0%, #3730a3 100%);
  color: #fef3c7;
  font-weight: 600;
  border: none;
  padding: 0.55rem 1rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: 0.86rem;
}
.flv-act-check-textarea-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(67,56,202,0.25);
}
.flv-act-check-textarea-submit:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}
@media (max-width: 480px) {
  .flv-act-check { padding: 0.75rem 0.85rem; }
  .flv-act-check-actions { flex-direction: column; }
  .flv-act-check-btn { width: 100%; }
  .flv-act-check-textarea-wrap { flex-direction: column; }
  .flv-act-check-textarea-submit { width: 100%; }
}

/* ============================================================================
   Map Decision Brief — 4-tab premium layout (Fase 3 Free+Map Proof Layer)
   ============================================================================ */
.mdt-root {
  margin: 1.5rem 0;
  font-feature-settings: "ss01" on, "ss02" on;
}

.mdt-tablist-wrap {
  position: relative;
  margin-bottom: 1.2rem;
}
/* Fade indicators de scroll lateral — sutil, nunca corta tabs */
.mdt-tablist-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 2px; /* alinea con el border-bottom */
  width: 36px;
  background: linear-gradient(to right, transparent, rgba(255,255,255,0.92));
  pointer-events: none;
  opacity: 0;
  transition: opacity 180ms ease;
  border-radius: 0 4px 0 0;
}
.mdt-tablist-wrap.mdt-tabs-overflow-right::after {
  opacity: 1;
}
.mdt-tablist-wrap::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 2px;
  width: 24px;
  background: linear-gradient(to left, transparent, rgba(255,255,255,0.92));
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  transition: opacity 180ms ease;
}
.mdt-tablist-wrap.mdt-tabs-overflow-left::before {
  opacity: 1;
}
.mdt-tablist {
  display: flex;
  gap: 0.35rem;
  border-bottom: 2px solid #e5e7eb;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* hide scrollbar — fade indicator lo reemplaza */
}
.mdt-tablist::-webkit-scrollbar { display: none; }
.mdt-tab {
  flex: 0 0 auto;
  padding: 0.7rem 1.1rem;
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  color: #6b7280;
  font-size: 0.92rem;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: color 200ms ease, border-color 200ms ease, background 200ms ease;
  margin-bottom: -2px;
}
.mdt-tab:hover { color: #312e81; background: #f5f3ff; border-radius: 6px 6px 0 0; }
.mdt-tab--active {
  color: #4338ca;
  border-bottom-color: #4f46e5;
  background: linear-gradient(180deg, transparent 0%, rgba(79,70,229,0.04) 100%);
}
.mdt-tab--active:hover { color: #4338ca; background: linear-gradient(180deg, transparent 0%, rgba(79,70,229,0.08) 100%); }

.mdt-panels {
  position: relative;
}
.mdt-panel {
  animation: mdtPanelFadeIn 320ms cubic-bezier(0.16,1,0.3,1);
}
@keyframes mdtPanelFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .mdt-panel { animation: none; }
}

.mdt-section {
  padding: 1.2rem 0;
}

/* Decision brief blocks */
.mdt-block {
  margin-bottom: 1.15rem;
  padding: 0.95rem 1.1rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
}
.mdt-block-label {
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: #6b7280;
  margin-bottom: 0.4rem;
}
.mdt-block-value {
  font-size: 1rem;
  line-height: 1.55;
  color: #1f2937;
  font-weight: 500;
}
.mdt-block--anchor {
  background: linear-gradient(135deg, #4f46e5 0%, #3730a3 100%);
  border-color: #3730a3;
  color: #fef3c7;
}
.mdt-block--anchor .mdt-block-label { color: rgba(254,243,199,0.85); }
.mdt-block-value--anchor {
  color: #fef3c7 !important;
  font-size: 1.18rem;
  font-weight: 700;
  letter-spacing: 0.005em;
}
.mdt-block--falsification {
  background: linear-gradient(135deg, #fff7ed 0%, #fed7aa 100%);
  border-color: #fb923c;
}
.mdt-block--falsification .mdt-block-label { color: #c2410c; }
.mdt-block--falsification .mdt-block-value { color: #7c2d12; font-style: italic; }
.mdt-block--wrong-move {
  background: #fef2f2;
  border-color: #fca5a5;
}
.mdt-block--wrong-move .mdt-block-label { color: #b91c1c; }
.mdt-block--wrong-move .mdt-block-value { color: #7f1d1d; }
.mdt-block--metric {
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  border-color: #6ee7b7;
}
.mdt-block--metric .mdt-block-label { color: #047857; }
.mdt-block-value--metric {
  color: #064e3b !important;
  font-size: 1.05rem;
  font-weight: 600;
}

.mdt-assumption-list {
  list-style: disc;
  padding-left: 1.5rem;
  margin: 0.4rem 0 0;
  color: #1f2937;
}
.mdt-assumption-list li {
  padding: 0.25rem 0;
  font-size: 0.95rem;
  line-height: 1.55;
}

/* v2 Mejora #2 — Map producto vivo: assumption_list con botones interactivos. */
.mdt-assumption-list--interactive {
  list-style: none;
  padding-left: 0;
}
.mdt-assumption-item {
  margin-bottom: 0.85rem;
  padding: 0.75rem 0.85rem;
  background: #fafafa;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
}
.mdt-assumption-text {
  font-size: 0.95rem;
  line-height: 1.55;
  color: #1f2937;
  margin-bottom: 0.55rem;
}
.mdt-assumption-actions {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.mdt-assumption-btn, .mdt-task-btn, .mdt-stop-btn {
  padding: 0.35rem 0.7rem;
  font-size: 0.82rem;
  font-weight: 600;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #4b5563;
  cursor: pointer;
  transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}
.mdt-assumption-btn:hover, .mdt-task-btn:hover, .mdt-stop-btn:hover {
  background: #f9fafb;
}
.mdt-assumption-btn--holding.is-selected {
  background: #ecfdf5;
  color: #047857;
  border-color: #6ee7b7;
}
.mdt-assumption-btn--questioning.is-selected {
  background: #fff7ed;
  color: #c2410c;
  border-color: #fdba74;
}
.mdt-assumption-btn--broken.is-selected {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fca5a5;
}

/* Regen banner */
.mdt-regen-banner {
  margin-top: 1rem;
}
.mdt-regen-banner-inner {
  background: linear-gradient(135deg, #fef3c7 0%, #fcd34d 100%);
  border: 1px solid #d97706;
  border-radius: 10px;
  padding: 1rem 1.1rem;
}
.mdt-regen-banner-reason {
  font-weight: 600;
  color: #78350f;
  font-size: 0.95rem;
  margin-bottom: 0.65rem;
}
.mdt-regen-banner-cta {
  background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
  color: #ffffff;
  font-weight: 600;
  border: none;
  padding: 0.55rem 1.2rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: 0.92rem;
  transition: transform 150ms ease, box-shadow 150ms ease;
}
.mdt-regen-banner-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(180,83,9,0.25);
}
.mdt-regen-banner-cta:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}
.mdt-regen-banner-disclaimer {
  margin-top: 0.55rem;
  font-size: 0.78rem;
  color: #78350f;
  font-style: italic;
}

.mdt-decision-trace {
  background: #f9fafb;
  border-color: #e5e7eb;
}
.mdt-decision-trace summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 0.92rem;
  color: #4338ca;
  list-style: none;
  padding: 0.3rem 0;
}
.mdt-decision-trace summary::-webkit-details-marker { display: none; }
.mdt-decision-trace summary::before { content: "▾ "; font-size: 0.78rem; color: #6366f1; }
.mdt-decision-trace[open] summary::before { content: "▴ "; }
.mdt-trace-list {
  display: grid;
  grid-template-columns: minmax(120px, 0.35fr) 1fr;
  gap: 0.5rem 0.85rem;
  margin: 0.75rem 0 0;
}
.mdt-trace-list dt {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: #4338ca;
  padding-top: 0.15rem;
}
.mdt-trace-list dd {
  margin: 0;
  font-size: 0.9rem;
  color: #1f2937;
  line-height: 1.5;
}

.mdt-escalation {
  background: #f8fafc;
}
.mdt-escalation-row {
  padding: 0.55rem 0;
  border-bottom: 1px dashed #e5e7eb;
  font-size: 0.92rem;
  color: #1f2937;
  line-height: 1.55;
}
.mdt-escalation-row:last-child { border-bottom: none; }
.mdt-escalation-row strong { display: inline-block; margin-bottom: 0.15rem; }
.mdt-escalation-row--sprint strong { color: #4338ca; }
.mdt-escalation-row--m90 strong { color: #6d28d9; }
.mdt-escalation-row--stop strong { color: #b91c1c; }

/* Stop doing tab */
.mdt-stop-doing { }
.mdt-stop-intro {
  font-size: 0.94rem;
  color: #6b7280;
  margin-bottom: 1rem;
  font-style: italic;
}
.mdt-stop-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.mdt-stop-item {
  margin: 0 0 0.85rem;
  padding: 0.85rem 1rem;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
  border-left: 4px solid #b91c1c;
}
.mdt-stop-action {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.mdt-stop-action-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 700;
  color: #b91c1c;
}
.mdt-stop-action-text {
  font-size: 1rem;
  color: #7f1d1d;
  font-weight: 600;
  line-height: 1.45;
}
.mdt-stop-why, .mdt-stop-instead {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px dashed rgba(185,28,28,0.18);
  font-size: 0.88rem;
  color: #7f1d1d;
  line-height: 1.5;
}
.mdt-stop-aux-label {
  font-weight: 700;
  color: #b91c1c;
  margin-right: 0.3rem;
}
.mdt-stop-item--structured {
  background: linear-gradient(135deg, #fef2f2 0%, #fff1f2 100%);
}

/* Continuity tab */
.mdt-continuity {
  padding-top: 0.5rem;
}
.mdt-continuity-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #111827;
  margin-bottom: 0.3rem;
}
.mdt-continuity-intro {
  font-size: 0.95rem;
  color: #6b7280;
  font-style: italic;
  margin-bottom: 1.2rem;
}
.mdt-continuity-grid {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.mdt-continuity-card {
  padding: 1rem 1.1rem;
  border-radius: 12px;
  border: 1px solid;
  background: #ffffff;
}
.mdt-continuity-card--sprint {
  background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 100%);
  border-color: #c7d2fe;
}
.mdt-continuity-card--momentum {
  background: linear-gradient(135deg, #f5f3ff 0%, #fef3c7 100%);
  border-color: #c4b5fd;
}
.mdt-continuity-card--donothing {
  background: #f9fafb;
  border-color: #d1d5db;
  border-style: dashed;
}
.mdt-continuity-card-tier {
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 800;
  margin-bottom: 0.55rem;
}
.mdt-continuity-card--sprint .mdt-continuity-card-tier { color: #4338ca; }
.mdt-continuity-card--momentum .mdt-continuity-card-tier { color: #6d28d9; }
.mdt-continuity-card--donothing .mdt-continuity-card-tier { color: #6b7280; }
.mdt-continuity-card-body {
  font-size: 0.93rem;
  line-height: 1.55;
  color: #1f2937;
}
.mdt-continuity-card--donothing .mdt-continuity-card-body { color: #4b5563; }

/* ── Execution Kit (Módulo A+B 2026-06-07): mensajes + canales done-for-you ── */
.mdt-kit-block-title {
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  font-weight: 800;
  color: #0f766e;
  margin: 1.4rem 0 0.7rem;
}
.mdt-kit-block-title:first-child { margin-top: 0; }
.mdt-kit-script {
  position: relative;
  background: linear-gradient(135deg, #f0fdfa 0%, #ffffff 100%);
  border: 1px solid #99f6e4;
  border-radius: 12px;
  padding: 0.85rem 1rem 0.9rem;
  margin-bottom: 0.85rem;
}
.mdt-kit-script-hdr {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: #0d9488;
  margin-bottom: 0.45rem;
}
.mdt-kit-script-msg {
  font-size: 0.95rem;
  line-height: 1.55;
  color: #134e4a;
  white-space: pre-wrap;
}
.mdt-kit-copy {
  margin-top: 0.6rem;
  font-size: 0.78rem;
  font-weight: 700;
  color: #0f766e;
  background: #ccfbf1;
  border: none;
  border-radius: 8px;
  padding: 0.35rem 0.8rem;
  cursor: pointer;
}
.mdt-kit-copy:hover { background: #99f6e4; }
.mdt-kit-script-why {
  margin-top: 0.5rem;
  font-size: 0.8rem;
  font-style: italic;
  color: #6b7280;
}
.mdt-kit-channel {
  border-left: 3px solid #0d9488;
  padding: 0.2rem 0 0.2rem 0.8rem;
  margin-bottom: 0.85rem;
}
.mdt-kit-channel-name { font-size: 0.96rem; font-weight: 700; color: #134e4a; }
.mdt-kit-channel-tt {
  font-size: 0.76rem;
  font-weight: 600;
  color: #0d9488;
  background: #f0fdfa;
  border-radius: 6px;
  padding: 0.1rem 0.45rem;
  margin-left: 0.35rem;
}
.mdt-kit-channel-why { font-size: 0.88rem; color: #4b5563; margin-top: 0.2rem; }
.mdt-kit-channel-action { font-size: 0.9rem; color: #1f2937; margin-top: 0.3rem; }
.mdt-kit-discard {
  margin-top: 1rem;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  padding: 0.75rem 0.95rem;
  font-size: 0.9rem;
  color: #92400e;
}

/* ── Execution Kit Módulo C (projection 2026-06-07): stat grid de esfuerzo ── */
.mdt-kit-projection {
  background: linear-gradient(135deg, #f0fdfa 0%, #ffffff 100%);
  border: 1px solid #99f6e4;
  border-radius: 12px;
  padding: 1rem 1.1rem 0.9rem;
  margin-bottom: 0.85rem;
}
.mdt-kit-proj-goal {
  font-size: 0.92rem;
  font-weight: 700;
  color: #134e4a;
  margin-bottom: 0.8rem;
}
.mdt-kit-proj-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 0.6rem;
}
.mdt-kit-proj-stat {
  background: #ffffff;
  border: 1px solid #ccfbf1;
  border-radius: 10px;
  padding: 0.6rem 0.5rem;
  text-align: center;
}
.mdt-kit-proj-num {
  font-size: 1.35rem;
  font-weight: 800;
  color: #0f766e;
  line-height: 1.2;
}
.mdt-kit-proj-label {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 600;
  color: #6b7280;
  margin-top: 0.25rem;
}
.mdt-kit-proj-disclaimer {
  margin-top: 0.8rem;
  font-size: 0.78rem;
  font-style: italic;
  color: #6b7280;
}

/* ── Execution Kit Módulo D (proof_case 2026-06-07): caso real ─────────────── */
.mdt-kit-proof {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-left: 3px solid #0d9488;
  border-radius: 12px;
  padding: 0.95rem 1.1rem 0.9rem;
  margin-bottom: 0.85rem;
}
.mdt-kit-proof-hdr {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 700;
  color: #0d9488;
  margin-bottom: 0.5rem;
}
.mdt-kit-proof-summary {
  font-size: 0.95rem;
  line-height: 1.55;
  color: #1f2937;
}
.mdt-kit-proof-metric {
  margin-top: 0.6rem;
  display: inline-block;
  font-size: 0.82rem;
  font-weight: 700;
  color: #0f766e;
  background: #f0fdfa;
  border: 1px solid #ccfbf1;
  border-radius: 8px;
  padding: 0.3rem 0.6rem;
}
.mdt-kit-proof-insight {
  margin-top: 0.6rem;
  font-size: 0.88rem;
  color: #4b5563;
}
.mdt-kit-proof-disclaimer {
  margin-top: 0.6rem;
  font-size: 0.78rem;
  font-style: italic;
  color: #9ca3af;
}

/* ── Sprint Upsell Card (F1 2026-06-01) ─────────────────────────────────── */
.mdt-sprint-upsell {
  margin: 2rem 0 0.5rem 0;
  background: linear-gradient(135deg, #1e1b4b 0%, #312e81 60%, #4338ca 100%);
  border-radius: 14px;
  padding: 1.6rem 1.5rem 1.4rem;
  color: #fff;
}
.mdt-sprint-upsell-eyebrow {
  font-size: 0.7rem;
  letter-spacing: 0.14em;
  font-weight: 800;
  color: #c7d2fe;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}
.mdt-sprint-upsell-headline {
  font-size: 1.15rem;
  font-weight: 800;
  line-height: 1.3;
  color: #fff;
  margin-bottom: 0.75rem;
}
.mdt-sprint-upsell-body {
  font-size: 0.92rem;
  line-height: 1.6;
  color: #c7d2fe;
  margin: 0 0 0.75rem 0;
}
.mdt-sprint-upsell-integrity {
  font-size: 0.8rem;
  color: #a5b4fc;
  margin: 0 0 1.1rem 0;
}
.mdt-sprint-upsell-cta {
  display: inline-block;
  background: #fff;
  color: #312e81;
  font-weight: 700;
  font-size: 0.92rem;
  padding: 0.6rem 1.2rem;
  border-radius: 8px;
  text-decoration: none;
  transition: background 150ms ease, color 150ms ease;
}
.mdt-sprint-upsell-cta:hover {
  background: #e0e7ff;
  color: #1e1b4b;
}
@media (max-width: 640px) {
  .mdt-sprint-upsell { padding: 1.2rem 1rem 1rem; }
  .mdt-sprint-upsell-headline { font-size: 1.02rem; }
}

/* Mobile breakpoints */
@media (max-width: 640px) {
  .mdt-tablist {
    gap: 0.2rem;
    padding-bottom: 0.1rem;
  }
  .mdt-tab {
    padding: 0.6rem 0.85rem;
    font-size: 0.85rem;
  }
  .mdt-block {
    padding: 0.85rem 0.9rem;
    margin-bottom: 0.85rem;
  }
  .mdt-block-value--anchor { font-size: 1.05rem; }
  .mdt-trace-list { grid-template-columns: 1fr; gap: 0.15rem 0; }
  .mdt-trace-list dt { padding-top: 0.45rem; }
  .mdt-continuity-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .mdt-tab { padding: 0.55rem 0.75rem; font-size: 0.82rem; }
  .mdt-block { padding: 0.75rem 0.85rem; }
  .mdt-block-value { font-size: 0.94rem; }
  .mdt-block-value--anchor { font-size: 1rem; }
  .mdt-stop-action-text { font-size: 0.94rem; }
}

/* ============================================================================
   Intake Followup — adaptive 1-question (Fase 2b)
   ============================================================================ */
.ifu-root {
  margin: 1.2rem 0;
  max-height: 800px;
  opacity: 1;
}
.ifu-card {
  background: linear-gradient(135deg, #eef2ff 0%, #f5f3ff 100%);
  border: 1px solid #c7d2fe;
  border-radius: 12px;
  padding: 1.1rem 1.15rem 1rem;
}
.ifu-title {
  font-size: 1rem;
  font-weight: 700;
  color: #3730a3;
  margin-bottom: 0.25rem;
}
.ifu-subtitle {
  font-size: 0.86rem;
  color: #4338ca;
  margin-bottom: 0.85rem;
  font-style: italic;
}
.ifu-question {
  background: #ffffff;
  padding: 0.75rem 0.9rem;
  border-left: 3px solid #6366f1;
  border-radius: 4px;
  font-size: 0.96rem;
  color: #1e1b4b;
  line-height: 1.55;
  margin-bottom: 0.85rem;
  font-weight: 500;
}
.ifu-answer {
  width: 100%;
  border: 1px solid #c7d2fe;
  border-radius: 8px;
  padding: 0.65rem 0.8rem;
  font-size: 0.94rem;
  color: #1f2937;
  background: #ffffff;
  resize: vertical;
  min-height: 70px;
  font-family: inherit;
}
.ifu-answer:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 2px rgba(99,102,241,0.18);
}
.ifu-actions {
  margin-top: 0.7rem;
  display: flex;
  gap: 0.55rem;
  flex-wrap: wrap;
}
.ifu-submit {
  background: linear-gradient(135deg, #4f46e5 0%, #3730a3 100%);
  color: #fef3c7;
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0.55rem 1.2rem;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: transform 150ms ease, box-shadow 150ms ease;
}
.ifu-submit:hover { transform: translateY(-1px); box-shadow: 0 4px 10px rgba(67,56,202,0.25); }
.ifu-submit:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }
.ifu-skip {
  background: transparent;
  color: #6366f1;
  font-weight: 500;
  font-size: 0.88rem;
  padding: 0.55rem 1rem;
  border: 1px solid #c7d2fe;
  border-radius: 8px;
  cursor: pointer;
}
.ifu-skip:hover { background: rgba(99,102,241,0.08); }
.ifu-skip:disabled { opacity: 0.5; cursor: not-allowed; }
.ifu-status {
  margin-top: 0.55rem;
  font-size: 0.84rem;
  color: #6366f1;
  font-style: italic;
}
@media (max-width: 480px) {
  .ifu-card { padding: 0.9rem 0.9rem 0.85rem; }
  .ifu-title { font-size: 0.95rem; }
  .ifu-question { font-size: 0.92rem; padding: 0.65rem 0.75rem; }
  .ifu-actions { flex-direction: column; }
  .ifu-submit, .ifu-skip { width: 100%; }
}

/* ============================================================================ */
/* Free Diagnosis Card V2 (2026-05-15) — Diagnostico Obsesivo                   */
/* Card unico narrativo que reemplaza el render apilado de 5 bloques.           */
/* Estetica premium indigo-gold, mobile breakpoints 640/480/380.                */
/* ============================================================================ */

.flv-diagnosis-card {
  max-width: 720px;
  margin: 1.5rem auto;
  padding: 2rem 2.25rem;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 8px 32px rgba(26, 31, 54, 0.08), 0 1px 3px rgba(26, 31, 54, 0.05);
  border: 1px solid #e8ebf3;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: #1a1f36;
  line-height: 1.55;
  position: relative;
  /* Free Premium 2026-05-21 (R15): sutil fade-in para que se sienta entregado, no impreso */
  animation: flv-fdc-fade-in 0.42s ease-out;
}
@keyframes flv-fdc-fade-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.flv-diagnosis-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, #4845b3 0%, #b48a3e 100%);
  border-radius: 14px 14px 0 0;
}
/* Free Premium 2026-05-21 (R15): severity colors moduladas en el border-top
   y un halo sutil — eleva la jerarquía visual sin gritar. Critical/high
   tienen tono más asertivo; low/medium quedan en indigo→gold neutro. */
.flv-diagnosis-card[data-fdc-severity="high"]::before {
  background: linear-gradient(90deg, #a35419 0%, #b48a3e 100%);
}
.flv-diagnosis-card[data-fdc-severity="critical"]::before {
  background: linear-gradient(90deg, #b03a2e 0%, #a35419 100%);
}
.flv-diagnosis-card[data-fdc-severity="critical"] {
  box-shadow: 0 8px 32px rgba(176, 58, 46, 0.10), 0 1px 3px rgba(26, 31, 54, 0.05);
}

.flv-diagnosis-card__header {
  margin-bottom: 1.5rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #eef1f6;
}
.flv-diagnosis-card__eyebrow {
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #b48a3e;
  font-weight: 600;
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.flv-diagnosis-card__pattern {
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.25;
  margin: 0;
  color: #1a1f36;
  letter-spacing: -0.01em;
}
.flv-diagnosis-card__severity {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.flv-diagnosis-card__severity--low { background: #eaf3ef; color: #2e7d5a; }
.flv-diagnosis-card__severity--medium { background: #fff5e3; color: #8a5a1a; }
.flv-diagnosis-card__severity--high { background: #fde9d6; color: #a35419; }
.flv-diagnosis-card__severity--critical { background: #fbe2e0; color: #b03a2e; }

.flv-diagnosis-card__section { margin: 1.75rem 0; }
.flv-diagnosis-card__section-label {
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5d6b85;
  font-weight: 600;
  margin-bottom: 0.6rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.flv-diagnosis-card__section-label::before {
  content: "";
  width: 14px;
  height: 2px;
  background: #b48a3e;
  display: inline-block;
}

.flv-diagnosis-card__mirror { display: flex; flex-direction: column; gap: 1rem; }
.flv-diagnosis-card__mirror-block {
  padding: 0.85rem 1.1rem;
  border-left: 3px solid #e8ebf3;
  background: #fafbfd;
  border-radius: 0 8px 8px 0;
  font-size: 0.98rem;
  line-height: 1.6;
}
.flv-diagnosis-card__mirror-block--factual { border-left-color: #4845b3; }
.flv-diagnosis-card__mirror-block--mirror { border-left-color: #7a5fc7; }
.flv-diagnosis-card__mirror-block--brutal { border-left-color: #b03a2e; background: #fdf3f2; }
.flv-diagnosis-card__mirror-block--honest { border-left-color: #5d6b85; }

.flv-diagnosis-card__contradiction {
  padding: 1.15rem 1.25rem;
  border-radius: 10px;
  background: #fff9f7;
  border: 1.5px solid #fde0d8;
  position: relative;
}
.flv-diagnosis-card__contradiction--critical { background: #fbe2e0; border-color: #f4b6ae; }
.flv-diagnosis-card__contradiction--high { background: #fdebda; border-color: #f4cf9b; }
.flv-diagnosis-card__contradiction--medium { background: #fff9e6; border-color: #f4e1a7; }
.flv-diagnosis-card__contradiction-narrative {
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
  color: #1a1f36;
  font-weight: 500;
}

.flv-diagnosis-card__bottleneck {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  padding: 1rem 0;
}
.flv-diagnosis-card__bottleneck-side {
  padding: 1rem 1.15rem;
  background: #fafbfd;
  border-radius: 8px;
  border: 1px solid #eef1f6;
}
.flv-diagnosis-card__bottleneck-label {
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5d6b85;
  font-weight: 600;
  margin-bottom: 0.4rem;
}
.flv-diagnosis-card__bottleneck-text {
  font-size: 0.95rem;
  line-height: 1.5;
  color: #1a1f36;
}
.flv-diagnosis-card__bottleneck-side--stated { border-left: 3px solid #9aa3b8; }
.flv-diagnosis-card__bottleneck-side--inferred {
  border-left: 3px solid #4845b3;
  background: #f5f4fc;
}
.flv-diagnosis-card__bottleneck-gap {
  grid-column: 1 / -1;
  font-size: 0.85rem;
  color: #5d6b85;
  font-style: italic;
  padding-top: 0.5rem;
}

.flv-diagnosis-card__cost {
  padding: 1.25rem 1.5rem;
  background: #fdf3f2;
  border-radius: 10px;
  border-left: 4px solid #d04444;
}
.flv-diagnosis-card__cost blockquote {
  margin: 0;
  font-size: 1.1rem;
  font-style: italic;
  color: #1a1f36;
  font-weight: 500;
  line-height: 1.4;
}
.flv-diagnosis-card__cost cite {
  display: block;
  margin-top: 0.5rem;
  font-size: 0.78rem;
  color: #8a4d4d;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.flv-diagnosis-card__cost-honest {
  font-size: 0.98rem;
  color: #1a1f36;
  line-height: 1.55;
  margin: 0;
}

.flv-diagnosis-card__next {
  padding: 1.5rem 1.65rem;
  background: linear-gradient(135deg, #1a1f36 0%, #2b2f4c 100%);
  color: #fafbff;
  border-radius: 12px;
  margin: 1.75rem 0;
}
.flv-diagnosis-card__next-label {
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #b48a3e;
  font-weight: 600;
  margin-bottom: 0.7rem;
}
.flv-diagnosis-card__next-text {
  font-size: 1.05rem;
  line-height: 1.6;
  margin: 0;
  color: #fafbff;
}
.flv-diagnosis-card__what-not {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(250, 251, 255, 0.12);
  font-size: 0.88rem;
  color: rgba(250, 251, 255, 0.78);
  line-height: 1.5;
}
.flv-diagnosis-card__what-not strong { color: #b48a3e; font-weight: 600; }

.flv-diagnosis-card__cta {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #eef1f6;
}
.flv-diagnosis-card__cta-buttons {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.flv-diagnosis-card__cta-primary {
  display: inline-block;
  padding: 14px 28px;
  background: linear-gradient(135deg, #4845b3 0%, #7a5fc7 100%);
  color: #ffffff !important;
  text-decoration: none;
  font-weight: 600;
  font-size: 1.05rem;
  border-radius: 10px;
  text-align: center;
  border: none;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  box-shadow: 0 2px 12px rgba(72, 69, 179, 0.25);
}
.flv-diagnosis-card__cta-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(72, 69, 179, 0.35);
}
.flv-diagnosis-card__cta-secondary {
  display: inline-block;
  padding: 12px 24px;
  background: transparent;
  color: #4845b3 !important;
  text-decoration: none;
  font-weight: 500;
  font-size: 0.95rem;
  border-radius: 10px;
  text-align: center;
  border: 1px solid #d2d6e0;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.flv-diagnosis-card__cta-secondary:hover {
  border-color: #4845b3;
  background: #f5f4fc;
}
.flv-diagnosis-card__cta-reasoning {
  font-size: 0.88rem;
  color: #5d6b85;
  line-height: 1.55;
  margin: 0;
  font-style: italic;
}
/* Free Premium 2026-05-21 (F5): disclaimer honesto cuando tier_confidence
   es bajo. Aparece ANTES del reasoning, con tono amber para señalar que el
   founder está en una zona donde el Map (no Sprint/M90) es la apuesta más
   segura — honestidad estratégica que sube confianza, no la baja. */
.flv-diagnosis-card__cta-low-confidence {
  margin: 0 0 0.65rem 0;
  padding: 0.7rem 0.9rem;
  font-size: 0.86rem;
  line-height: 1.55;
  color: #6b4f0b;
  background: linear-gradient(180deg, #fef7e7 0%, #fdebc0 100%);
  border: 1px solid #f0d488;
  border-left: 3px solid #d99a16;
  border-radius: 8px;
}

/* ============================================================================
   Diagnostico Obsesivo v2 — premium extensions (sneak peek + CTA value props)
   ============================================================================ */

/* Sneak peek del Execution Map (premium teaser estructural) */
.flv-diagnosis-card__sneak-peek {
  margin-top: 2.25rem;
  padding: 1.75rem 1.5rem 1.5rem;
  background: linear-gradient(180deg, #fbf8f1 0%, #f5f0e3 100%);
  border: 1px solid #e8dcc0;
  border-radius: 14px;
  position: relative;
  box-shadow: 0 1px 6px rgba(180, 138, 62, 0.08);
}
.flv-diagnosis-card__sneak-peek::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #b48a3e 0%, #d4b27a 50%, #b48a3e 100%);
  border-radius: 14px 14px 0 0;
}
.flv-diagnosis-card__sneak-peek-header {
  margin-bottom: 1.25rem;
}
.flv-diagnosis-card__sneak-peek-eyebrow {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #8a6a2a;
  margin-bottom: 0.5rem;
}
.flv-diagnosis-card__sneak-peek-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1a1f36;
  margin: 0;
  line-height: 1.35;
}
.flv-diagnosis-card__sneak-peek-block {
  margin: 1.1rem 0;
  padding: 0.95rem 1.1rem;
  background: #ffffff;
  border-radius: 10px;
  border-left: 3px solid #b48a3e;
}
.flv-diagnosis-card__sneak-peek-block--roadmap {
  border-left-color: #4845b3;
}
.flv-diagnosis-card__sneak-peek-block-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5d6b85;
  margin-bottom: 0.5rem;
}
.flv-diagnosis-card__sneak-peek-block-text {
  font-size: 0.95rem;
  color: #1a1f36;
  line-height: 1.55;
}
.flv-diagnosis-card__sneak-peek-locked {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 8px;
  background: #f5f0e3;
  border-radius: 12px;
  font-size: 0.75rem;
  color: #8a6a2a;
  font-style: italic;
  white-space: nowrap;
}
/* Muestra gratis (2026-05-30): 1 pieza real del Map revelada como prueba de
   profundidad. Verde = "esto es tuyo ahora", contrasta con los candados dorados. */
.flv-diagnosis-card__sneak-peek-free-sample {
  margin: 1.1rem 0;
  padding: 1rem 1.15rem;
  background: #f0faf4;
  border: 1px solid #cfeede;
  border-left: 3px solid #2d7a4a;
  border-radius: 10px;
}
.flv-diagnosis-card__sneak-peek-free-sample-badge {
  display: inline-block;
  padding: 2px 9px;
  background: #2d7a4a;
  color: #ffffff;
  border-radius: 12px;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.flv-diagnosis-card__sneak-peek-free-sample-eyebrow {
  font-size: 0.72rem;
  color: #2d7a4a;
  font-weight: 600;
  margin: 0.55rem 0 0.3rem 0;
}
.flv-diagnosis-card__sneak-peek-free-sample-action {
  font-size: 1rem;
  font-weight: 700;
  color: #143b25;
  line-height: 1.5;
  margin-bottom: 0.55rem;
}
.flv-diagnosis-card__sneak-peek-free-sample-row {
  font-size: 0.9rem;
  color: #1a1f36;
  line-height: 1.5;
  margin-top: 0.35rem;
}
.flv-diagnosis-card__sneak-peek-free-sample-row-label {
  font-weight: 700;
  color: #2d7a4a;
  margin-right: 4px;
}
.flv-diagnosis-card__sneak-peek-week-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}
.flv-diagnosis-card__sneak-peek-week-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.85rem;
  background: linear-gradient(135deg, #f5f4fc 0%, #ebe8f9 100%);
  border: 1px solid #d9d3f0;
  border-radius: 999px;
  font-size: 0.85rem;
}
.flv-diagnosis-card__sneak-peek-week-num {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #4845b3;
  background: #ffffff;
  padding: 1px 6px;
  border-radius: 6px;
}
.flv-diagnosis-card__sneak-peek-week-title {
  color: #1a1f36;
  font-weight: 500;
}
.flv-diagnosis-card__sneak-peek-footer {
  margin-top: 1.1rem;
  padding-top: 0.95rem;
  border-top: 1px dashed #e8dcc0;
}
.flv-diagnosis-card__sneak-peek-locked-pill {
  display: inline-block;
  padding: 6px 12px;
  background: #ffffff;
  border: 1px solid #e8dcc0;
  border-radius: 999px;
  font-size: 0.85rem;
  color: #8a6a2a;
  font-weight: 500;
}
.flv-diagnosis-card__sneak-peek-locked-list {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
}
.flv-diagnosis-card__sneak-peek-locked-list li {
  padding: 0.4rem 0;
  font-size: 0.85rem;
  color: #5d6b85;
}

/* CTA premium: value props + microcopy + differentiator + comparison */
.flv-diagnosis-card__cta-value-props {
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
}
.flv-diagnosis-card__cta-value-props li {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.55rem 0;
  font-size: 0.95rem;
  color: #1a1f36;
  line-height: 1.5;
}
.flv-diagnosis-card__cta-check {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  margin-top: 1px;
  background: linear-gradient(135deg, #b48a3e 0%, #d4b27a 100%);
  color: #ffffff;
  font-weight: 700;
  font-size: 0.85rem;
  border-radius: 50%;
}
.flv-diagnosis-card__cta-primary-wrap,
.flv-diagnosis-card__cta-secondary-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.flv-diagnosis-card__cta-microcopy {
  font-size: 0.82rem;
  color: #5d6b85;
  text-align: center;
  line-height: 1.4;
  font-style: italic;
}
.flv-diagnosis-card__cta-microcopy--secondary {
  font-style: normal;
  color: #7a8294;
  font-size: 0.78rem;
}
.flv-diagnosis-card__cta-differentiator,
.flv-diagnosis-card__cta-comparison {
  margin-top: 1.1rem;
  padding: 0.85rem 1.1rem;
  background: #fafbfd;
  border: 1px solid #e8ecf2;
  border-radius: 10px;
  cursor: pointer;
}
.flv-diagnosis-card__cta-differentiator summary,
.flv-diagnosis-card__cta-comparison summary {
  font-weight: 600;
  font-size: 0.92rem;
  color: #4845b3;
  cursor: pointer;
  list-style: none;
  position: relative;
  padding-left: 1.2rem;
}
.flv-diagnosis-card__cta-differentiator summary::-webkit-details-marker,
.flv-diagnosis-card__cta-comparison summary::-webkit-details-marker {
  display: none;
}
.flv-diagnosis-card__cta-differentiator summary::before,
.flv-diagnosis-card__cta-comparison summary::before {
  content: "▸";
  position: absolute;
  left: 0;
  top: 0;
  color: #b48a3e;
  font-size: 0.88rem;
  transition: transform 0.2s ease;
}
.flv-diagnosis-card__cta-differentiator[open] summary::before,
.flv-diagnosis-card__cta-comparison[open] summary::before {
  transform: rotate(90deg);
}
.flv-diagnosis-card__cta-differentiator p {
  margin: 0.85rem 0 0;
  font-size: 0.92rem;
  line-height: 1.6;
  color: #1a1f36;
}
.flv-diagnosis-card__cta-comparison-intro {
  margin: 0.85rem 0 0.65rem;
  font-size: 0.92rem;
  line-height: 1.55;
  color: #1a1f36;
}
.flv-diagnosis-card__cta-comparison-table {
  width: 100%;
  margin: 0.65rem 0 0.85rem;
  border-collapse: collapse;
  font-size: 0.88rem;
}
.flv-diagnosis-card__cta-comparison-table th,
.flv-diagnosis-card__cta-comparison-table td {
  padding: 0.6rem 0.75rem;
  text-align: left;
  border-bottom: 1px solid #eef1f6;
  vertical-align: top;
}
.flv-diagnosis-card__cta-comparison-table th {
  width: 32%;
  color: #5d6b85;
  font-weight: 600;
  background: #fafbfd;
  white-space: nowrap;
}
.flv-diagnosis-card__cta-comparison-table td {
  color: #1a1f36;
  line-height: 1.5;
}
.flv-diagnosis-card__cta-comparison-note {
  margin: 0;
  font-size: 0.82rem;
  color: #5d6b85;
  font-style: italic;
  line-height: 1.5;
}

@media (max-width: 640px) {
  .flv-diagnosis-card__sneak-peek { padding: 1.25rem 1.1rem; }
  .flv-diagnosis-card__sneak-peek-title { font-size: 1.05rem; }
  .flv-diagnosis-card__sneak-peek-week-chips { flex-direction: column; }
  .flv-diagnosis-card__sneak-peek-week-chip { width: 100%; }
  .flv-diagnosis-card__cta-comparison-table th { width: 38%; font-size: 0.82rem; }
  .flv-diagnosis-card__cta-comparison-table td { font-size: 0.85rem; }
}
@media (max-width: 480px) {
  .flv-diagnosis-card__sneak-peek { padding: 1.1rem 0.9rem; border-radius: 10px; }
  .flv-diagnosis-card__sneak-peek-title { font-size: 1rem; }
  .flv-diagnosis-card__sneak-peek-block { padding: 0.75rem 0.9rem; }
  .flv-diagnosis-card__sneak-peek-block-text { font-size: 0.9rem; }
  .flv-diagnosis-card__sneak-peek-locked { display: block; margin-left: 0; margin-top: 4px; }
  .flv-diagnosis-card__cta-value-props li { font-size: 0.9rem; }
  .flv-diagnosis-card__cta-differentiator,
  .flv-diagnosis-card__cta-comparison { padding: 0.75rem 0.85rem; }
}
@media (max-width: 380px) {
  .flv-diagnosis-card__sneak-peek { padding: 1rem 0.75rem; }
  .flv-diagnosis-card__sneak-peek-eyebrow { font-size: 0.66rem; }
  .flv-diagnosis-card__sneak-peek-title { font-size: 0.95rem; }
  .flv-diagnosis-card__sneak-peek-block { padding: 0.65rem 0.75rem; }
  .flv-diagnosis-card__cta-check { width: 18px; height: 18px; font-size: 0.75rem; }
}

.flv-diagnosis-card__engine-note {
  margin-top: 1.25rem;
  padding: 10px 14px;
  background: #fafbfd;
  border: 1px dashed #d2d6e0;
  border-radius: 8px;
  font-size: 0.78rem;
  color: #7a8294;
  line-height: 1.5;
  font-style: italic;
}
.flv-diagnosis-card__engine-note-icon {
  color: #4845b3;
  font-style: normal;
  margin-right: 4px;
}

.flv-diagnosis-card__quote {
  margin: 1rem 0;
  padding: 14px 18px;
  border-left: 3px solid #b48a3e;
  background: #fbf8f1;
  border-radius: 0 8px 8px 0;
}
.flv-diagnosis-card__quote blockquote {
  margin: 0;
  font-size: 0.98rem;
  font-style: italic;
  color: #1a1f36;
  line-height: 1.5;
}
.flv-diagnosis-card__quote cite {
  display: block;
  margin-top: 6px;
  font-size: 0.7rem;
  color: #8a6a2a;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

@media (max-width: 640px) {
  .flv-diagnosis-card { padding: 1.5rem 1.25rem; margin: 1rem 0.5rem; }
  .flv-diagnosis-card__pattern { font-size: 1.3rem; }
  .flv-diagnosis-card__bottleneck { grid-template-columns: 1fr; gap: 0.75rem; }
  .flv-diagnosis-card__next { padding: 1.25rem 1.25rem; }
  .flv-diagnosis-card__next-text { font-size: 0.98rem; }
  .flv-diagnosis-card__cost blockquote { font-size: 1rem; }
}
@media (max-width: 480px) {
  .flv-diagnosis-card { padding: 1.25rem 1rem; border-radius: 10px; }
  .flv-diagnosis-card__pattern { font-size: 1.15rem; }
  .flv-diagnosis-card__cta-primary { padding: 12px 20px; font-size: 0.98rem; }
  .flv-diagnosis-card__mirror-block { padding: 0.7rem 0.85rem; font-size: 0.92rem; }
}
@media (max-width: 380px) {
  .flv-diagnosis-card { padding: 1rem 0.85rem; }
  .flv-diagnosis-card__pattern { font-size: 1.05rem; }
  .flv-diagnosis-card__contradiction { padding: 0.85rem 0.95rem; }
  .flv-diagnosis-card__contradiction-narrative { font-size: 0.92rem; }
}

/* ============================================================================
   Sprint30 Premium 2026-05 — A: Sprint Operating Thesis sticky header
   E: Recovery Mode card | F: Pattern Mirror | Day 1 brutal extendido
   ============================================================================ */

/* (A) Sprint Operating Thesis — premium sticky header */
.sprint-thesis-header { margin: 0.75rem 0 1rem; }
.sprint-thesis-header.hidden { display: none; }
.sprint-thesis-inner {
  padding: 0.9rem 1.1rem;
  border-radius: 14px;
  background: linear-gradient(135deg, #1e293b 0%, #312e81 60%, #4338ca 100%);
  color: #f1f5f9;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.18);
  border-left: 4px solid #fbbf24;
  position: relative;
}
.sprint-thesis-label {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size: 0.78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: #fde68a;
  margin-bottom: 0.4rem;
}
.sprint-thesis-icon { color: #fbbf24; font-size: 0.95rem; }
.sprint-thesis-text {
  font-size: 1.02rem; line-height: 1.5; font-weight: 500;
  color: #f8fafc; margin-bottom: 0.55rem;
  overflow-wrap: break-word;
}
.sprint-thesis-meta {
  display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center;
}
.sprint-thesis-chip {
  display: inline-block; padding: 0.22rem 0.6rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: #e0e7ff;
  font-size: 0.74rem; font-weight: 500;
  border: 1px solid rgba(251, 191, 36, 0.3);
}
.sprint-thesis-forbidden {
  display: inline-block; padding: 0.22rem 0.6rem;
  border-radius: 999px;
  background: rgba(220, 38, 38, 0.18);
  color: #fecaca;
  font-size: 0.74rem; font-weight: 500;
  border: 1px solid rgba(248, 113, 113, 0.35);
}

/* (B) Microcycle card — corazon del Sprint30 (teal-amber, prominente).
   Pesa mas visualmente que recovery/pattern: es el ciclo de ejecucion
   de 3 dias sobre el que gira el producto. */
.microcycle-card { margin: 0.75rem 0 1.1rem; }
.microcycle-card.hidden { display: none; }
.microcycle-inner {
  padding: 1.15rem 1.25rem;
  border-radius: 14px;
  background: linear-gradient(135deg, #f0fdfa 0%, #ffffff 55%, #fffbeb 100%);
  border-left: 4px solid #14b8a6;
  box-shadow: 0 6px 22px rgba(20, 184, 166, 0.12), 0 2px 6px rgba(15, 23, 42, 0.04);
  position: relative;
}
.microcycle-inner.mc-review-active {
  border-left-color: #dc2626;
  background: linear-gradient(135deg, #fff1f2 0%, #ffffff 55%, #fffbeb 100%);
  box-shadow: 0 6px 22px rgba(220, 38, 38, 0.14), 0 2px 6px rgba(15, 23, 42, 0.05);
}
.mc-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 0.6rem; flex-wrap: wrap; gap: 0.4rem;
}
.mc-header-left { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.mc-title {
  font-weight: 700; color: #0f766e; font-size: 0.92rem;
  letter-spacing: 0.04em; text-transform: uppercase;
}
.mc-day-progress { font-weight: 600; color: #475569; font-size: 0.88rem; }
.mc-source { font-size: 0.75rem; color: #64748b; }
.mc-review-badge {
  display: inline-block; padding: 0.18rem 0.55rem;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em;
  text-transform: uppercase; background: #dc2626; color: #fff;
  border-radius: 999px;
}
.mc-hypothesis { margin-bottom: 0.55rem; }
.mc-hypothesis-label, .mc-metric-label {
  font-size: 0.76rem; color: #0f766e; text-transform: uppercase;
  letter-spacing: 0.05em; font-weight: 700; margin-bottom: 0.2rem;
}
.mc-hypothesis-text, .mc-metric-text { color: #0f172a; font-weight: 500; line-height: 1.45; overflow-wrap: break-word; }
.mc-forecast {
  margin-top: 0.6rem; padding: 0.6rem 0.75rem;
  background: rgba(99, 102, 241, 0.06);
  border-radius: 8px; border-left: 3px solid #6366f1;
}
.mc-forecast-title {
  font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.05em;
  font-weight: 700; color: #4338ca; margin-bottom: 0.3rem;
}
.mc-forecast-row { display: flex; flex-wrap: wrap; gap: 0.7rem; font-size: 0.88rem; color: #1e293b; }
.mc-forecast-meta { margin-top: 0.25rem; font-size: 0.72rem; color: #64748b; }
.mc-actual {
  margin-top: 0.4rem; padding: 0.55rem 0.75rem;
  background: rgba(16, 185, 129, 0.06);
  border-radius: 8px; border-left: 3px solid #10b981;
}
.mc-actual-title {
  font-size: 0.74rem; text-transform: uppercase; letter-spacing: 0.05em;
  font-weight: 700; color: #065f46; margin-bottom: 0.25rem;
}
.mc-actual-row { font-size: 0.86rem; }
.mc-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.85rem; }
.mc-btn {
  flex: 1 1 auto; min-width: 120px;
  padding: 0.6rem 0.8rem; border: none; border-radius: 9px;
  color: #fff; font-weight: 600; cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
.mc-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(15, 23, 42, 0.18); }
.mc-btn:active { transform: translateY(0); opacity: 0.92; }
.mc-btn-confirm { background: #16a34a; }
.mc-btn-confirm:hover { background: #15803d; }
.mc-btn-pivot { background: #d97706; }
.mc-btn-pivot:hover { background: #b45309; }
.mc-btn-drop { background: #6b7280; }
.mc-btn-drop:hover { background: #4b5563; }
.mc-actions-hint { margin: 0.5rem 0 0; font-size: 0.78rem; color: #6b7280; }
@media (max-width: 480px) {
  .microcycle-inner { padding: 1rem 0.95rem; border-radius: 12px; }
  .mc-actions { flex-direction: column; }
  .mc-btn { width: 100%; }
}

/* (E) Recovery Mode card — tono empatico (no rojo alarmista) */
.recovery-mode-card { margin: 0.75rem 0 1rem; }
.recovery-mode-card.hidden { display: none; }
.recovery-card-inner {
  padding: 1rem 1.1rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  border-left: 4px solid #d97706;
  box-shadow: 0 4px 14px rgba(217, 119, 6, 0.12);
}
.recovery-severity-deep .recovery-card-inner,
.recovery-card-inner.recovery-severity-deep {
  background: linear-gradient(135deg, #fef3c7 0%, #fed7aa 100%);
  border-left-color: #c2410c;
}
.recovery-header { display: flex; gap: 0.7rem; align-items: flex-start; margin-bottom: 0.5rem; }
.recovery-icon { font-size: 1.4rem; color: #92400e; line-height: 1; }
.recovery-title-block { flex: 1; }
.recovery-title { font-size: 1rem; font-weight: 700; color: #78350f; line-height: 1.2; }
.recovery-subtitle { font-size: 0.82rem; color: #92400e; margin-top: 0.15rem; }
.recovery-body {
  font-size: 0.92rem; line-height: 1.5; color: #451a03;
  margin: 0.5rem 0 0.85rem;
}
.recovery-friction-block { margin-top: 0.7rem; }
.recovery-friction-title {
  font-size: 0.82rem; font-weight: 600; color: #78350f;
  margin-bottom: 0.4rem;
}
.recovery-friction-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.recovery-chip {
  padding: 0.35rem 0.8rem;
  border-radius: 999px;
  background: #fffbeb;
  border: 1px solid #fcd34d;
  color: #78350f;
  font-size: 0.82rem; font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}
.recovery-chip:hover { background: #fef3c7; transform: translateY(-1px); }
.recovery-chip-active {
  background: #d97706; color: #fffbeb; border-color: #b45309;
  box-shadow: 0 2px 8px rgba(217, 119, 6, 0.3);
}
/* G2 Cierre 2026-05 — confirmacion in-line tras POST exitoso. */
.recovery-friction-confirmation {
  margin-top: 0.6rem;
  padding: 0.55rem 0.75rem;
  background: #ecfdf5;
  border-left: 3px solid #10b981;
  border-radius: 6px;
  color: #065f46;
  font-size: 0.85rem;
  font-style: italic;
  animation: recovery-friction-fade-in 0.4s ease-out;
}
@keyframes recovery-friction-fade-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* (F) Pattern Mirror card — espejo, no juicio (indigo soft) */
.pattern-mirror-card { margin: 0.75rem 0 1rem; transition: opacity 0.4s, transform 0.4s; }
.pattern-mirror-card.hidden { display: none; }
.pattern-mirror-inner {
  padding: 1rem 1.1rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%);
  border-left: 4px solid #6366f1;
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.1);
}
.pattern-mirror-high .pattern-mirror-inner,
.pattern-mirror-inner.pattern-mirror-high {
  border-left-color: #4f46e5;
  background: linear-gradient(135deg, #e0e7ff 0%, #c7d2fe 100%);
}
.pattern-mirror-header { display: flex; gap: 0.7rem; align-items: flex-start; }
.pattern-mirror-icon { font-size: 1.4rem; line-height: 1; color: #4f46e5; }
.pattern-mirror-title-block { flex: 1; }
.pattern-mirror-title { font-size: 0.95rem; font-weight: 700; color: #312e81; }
.pattern-mirror-subtitle {
  font-size: 0.78rem; color: #4338ca; margin-top: 0.1rem;
  font-style: italic;
}
.pattern-mirror-label {
  font-size: 1rem; font-weight: 600; color: #1e293b;
  margin: 0.6rem 0 0.4rem;
}
.pattern-mirror-detail {
  font-size: 0.88rem; line-height: 1.5; color: #334155;
  margin-bottom: 0.7rem;
}
.pattern-mirror-meta { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-bottom: 0.8rem; }
.pattern-mirror-chip {
  display: inline-block; padding: 0.18rem 0.55rem;
  border-radius: 999px;
  background: rgba(99, 102, 241, 0.12);
  color: #4338ca;
  font-size: 0.72rem; font-weight: 500;
  border: 1px solid rgba(99, 102, 241, 0.25);
}
.pattern-mirror-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.pattern-mirror-btn {
  padding: 0.4rem 0.85rem;
  border-radius: 8px;
  border: 1px solid #c7d2fe;
  background: #fafafa;
  color: #312e81;
  font-size: 0.85rem; font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}
.pattern-mirror-btn:hover { background: #e0e7ff; transform: translateY(-1px); }
.pattern-mirror-btn-primary {
  background: #4f46e5; color: #fff; border-color: #4338ca;
}
.pattern-mirror-btn-primary:hover { background: #4338ca; color: #fff; }

/* (Day 1 extended) Hallazgos, thesis dentro de Day1, no-hacer, continuity */
.d1w-hallazgos-block { margin-top: 1.2rem; padding: 0.85rem 1rem; background: #f8fafc; border-left: 3px solid #6366f1; border-radius: 6px; }
.d1w-hallazgos-title { font-size: 0.85rem; font-weight: 700; color: #1e293b; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.45rem; }
.d1w-hallazgos-list { list-style: none; padding: 0; margin: 0; }
.d1w-hallazgos-list li {
  position: relative; padding: 0.25rem 0 0.25rem 1.2rem;
  font-size: 0.92rem; line-height: 1.5; color: #334155;
}
.d1w-hallazgos-list li::before {
  content: "•"; position: absolute; left: 0.2rem; top: 0.3rem;
  color: #6366f1; font-weight: 700; font-size: 1rem;
}

.d1w-thesis-block { margin-top: 1.2rem; padding: 0.9rem 1.1rem; background: linear-gradient(135deg, #1e293b 0%, #312e81 100%); color: #f8fafc; border-radius: 10px; border-left: 4px solid #fbbf24; }
.d1w-thesis-label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #fde68a; margin-bottom: 0.35rem; }
.d1w-thesis-text { font-size: 1rem; line-height: 1.45; font-weight: 500; color: #f8fafc; margin-bottom: 0.5rem; }
.d1w-thesis-meta { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.d1w-thesis-chip {
  display: inline-block; padding: 0.18rem 0.55rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: #e0e7ff;
  font-size: 0.72rem; font-weight: 500;
  border: 1px solid rgba(251, 191, 36, 0.3);
}

.d1w-nohacer-block { margin-top: 1.2rem; padding: 0.85rem 1rem; background: #fef2f2; border-left: 3px solid #dc2626; border-radius: 6px; }
.d1w-nohacer-title { font-size: 0.85rem; font-weight: 700; color: #7f1d1d; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.45rem; }
.d1w-nohacer-list { list-style: none; padding: 0; margin: 0; }
.d1w-nohacer-list li {
  display: flex; align-items: flex-start; gap: 0.4rem;
  padding: 0.25rem 0; font-size: 0.92rem; color: #7f1d1d;
}
.d1w-no-icon { color: #dc2626; font-weight: 700; flex: 0 0 auto; }

.d1w-continuity-block { margin-top: 1.2rem; padding: 0.85rem 1rem; border-radius: 6px; }
.d1w-continuity-map { background: #ecfdf5; border-left: 3px solid #059669; }
.d1w-continuity-seed { background: #f0f9ff; border-left: 3px solid #0284c7; }
.d1w-continuity-label { font-size: 0.85rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.35rem; }
.d1w-continuity-map .d1w-continuity-label { color: #064e3b; }
.d1w-continuity-seed .d1w-continuity-label { color: #0c4a6e; }
.d1w-continuity-text { font-size: 0.92rem; line-height: 1.5; color: #334155; }
.d1w-continuity-note { font-size: 0.78rem; color: #475569; font-style: italic; margin-bottom: 0.35rem; }

/* ============================================================================
   Day 1 Premium 2026-05-16 — Engine Decisions Manifest + Reality Check + Timeline
   Solo se rendea para Sprint30 Direct Buyer en día 1. Prueba el motor antes
   de que el user dude por qué pagó $499.
   ============================================================================ */

/* (1) Engine Decisions Manifest */
.d1w-manifest-block {
  margin-top: 1.4rem;
  padding: 1.2rem 1.1rem;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
  border-radius: 12px;
  border-left: 4px solid #4f46e5;
  box-shadow: 0 4px 18px rgba(79, 70, 229, 0.08);
}
.d1w-manifest-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #312e81;
  margin-bottom: 0.35rem;
  letter-spacing: -0.01em;
}
.d1w-manifest-subtitle {
  font-size: 0.85rem;
  color: #4338ca;
  margin-bottom: 1rem;
  line-height: 1.45;
  opacity: 0.85;
}
.d1w-manifest-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.d1w-manifest-item {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.7rem 0.85rem;
  background: #ffffff;
  border-radius: 8px;
  border: 1px solid #e0e7ff;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.d1w-manifest-item:hover {
  transform: translateX(2px);
  box-shadow: 0 2px 10px rgba(79, 70, 229, 0.1);
}
.d1w-manifest-icon {
  flex: 0 0 auto;
  font-size: 1.25rem;
  line-height: 1;
  color: #4f46e5;
  margin-top: 0.1rem;
}
.d1w-manifest-body { flex: 1 1 auto; min-width: 0; }
.d1w-manifest-item-title {
  font-size: 0.92rem;
  font-weight: 600;
  color: #1e1b4b;
  margin-bottom: 0.2rem;
}
.d1w-manifest-n { color: #6366f1; font-weight: 700; margin-right: 0.25rem; }
.d1w-manifest-item-value {
  font-size: 0.9rem;
  color: #374151;
  line-height: 1.45;
  margin-bottom: 0.2rem;
  word-break: break-word;
}
.d1w-manifest-item-source {
  font-size: 0.76rem;
  color: #6b7280;
  font-style: italic;
}

/* (2) Reality Check side-by-side */
.d1w-rcheck-block {
  margin-top: 1.4rem;
  padding: 1.2rem 1.1rem;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.05);
}
.d1w-rcheck-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.35rem;
  letter-spacing: -0.01em;
}
.d1w-rcheck-subtitle {
  font-size: 0.85rem;
  color: #475569;
  margin-bottom: 1rem;
  font-style: italic;
}
.d1w-rcheck-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.d1w-rcheck-side {
  padding: 0.95rem 0.9rem;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.d1w-rcheck-generic {
  background: linear-gradient(180deg, #fef2f2 0%, #fef9f9 100%);
  border: 1px solid #fecaca;
}
.d1w-rcheck-motor {
  background: linear-gradient(180deg, #ecfdf5 0%, #f0fdf4 100%);
  border: 1px solid #a7f3d0;
}
.d1w-rcheck-side-label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.d1w-rcheck-generic .d1w-rcheck-side-label { color: #991b1b; }
.d1w-rcheck-motor .d1w-rcheck-side-label { color: #065f46; }
.d1w-rcheck-side-sublabel {
  font-size: 0.74rem;
  color: #64748b;
  font-style: italic;
}
.d1w-rcheck-action {
  font-size: 0.9rem;
  line-height: 1.55;
  color: #1f2937;
  padding: 0.65rem 0.7rem;
  background: #ffffff;
  border-radius: 6px;
  border-left: 3px solid #94a3b8;
  font-style: italic;
}
.d1w-rcheck-motor .d1w-rcheck-action { border-left-color: #10b981; }
.d1w-rcheck-generic .d1w-rcheck-action { border-left-color: #dc2626; }
.d1w-rcheck-obs {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.32rem;
}
.d1w-rcheck-obs li {
  font-size: 0.82rem;
  display: flex;
  gap: 0.45rem;
  align-items: flex-start;
  line-height: 1.4;
}
.d1w-rcheck-neg li { color: #7f1d1d; }
.d1w-rcheck-pos li { color: #064e3b; }
.d1w-rcheck-icon-neg { color: #dc2626; font-weight: 700; flex: 0 0 auto; }
.d1w-rcheck-icon-pos { color: #10b981; font-weight: 700; flex: 0 0 auto; }

/* (3) Sprint Motor Timeline */
.d1w-timeline-block {
  margin-top: 1.4rem;
  padding: 1.2rem 1.1rem;
  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
  border-radius: 12px;
  border-left: 4px solid #0284c7;
}
.d1w-timeline-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0c4a6e;
  margin-bottom: 0.35rem;
}
.d1w-timeline-subtitle {
  font-size: 0.85rem;
  color: #0369a1;
  margin-bottom: 1.1rem;
  opacity: 0.85;
}
.d1w-timeline-list {
  list-style: none;
  padding: 0;
  margin: 0;
  position: relative;
}
.d1w-timeline-list::before {
  content: "";
  position: absolute;
  left: 53px;
  top: 14px;
  bottom: 14px;
  width: 2px;
  background: linear-gradient(180deg, #0284c7 0%, #38bdf8 100%);
  opacity: 0.4;
}
.d1w-timeline-item {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.45rem 0;
  position: relative;
}
.d1w-timeline-day {
  flex: 0 0 48px;
  text-align: right;
  font-size: 0.85rem;
  font-weight: 700;
  color: #0c4a6e;
  padding-right: 0.4rem;
}
.d1w-timeline-dot {
  flex: 0 0 10px;
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: #0284c7;
  box-shadow: 0 0 0 3px #ffffff, 0 0 0 4px rgba(2, 132, 199, 0.3);
  z-index: 1;
}
.d1w-timeline-item-first .d1w-timeline-dot,
.d1w-timeline-item-last .d1w-timeline-dot {
  background: #0c4a6e;
  box-shadow: 0 0 0 3px #ffffff, 0 0 0 5px rgba(12, 74, 110, 0.45);
}
.d1w-timeline-label {
  font-size: 0.9rem;
  color: #0f172a;
  line-height: 1.4;
  flex: 1 1 auto;
}

/* Mobile 640 */
@media (max-width: 640px) {
  .d1w-rcheck-grid { grid-template-columns: 1fr; }
  .d1w-manifest-item { padding: 0.55rem 0.7rem; gap: 0.55rem; }
  .d1w-manifest-icon { font-size: 1.1rem; }
  .d1w-timeline-day { flex: 0 0 40px; font-size: 0.78rem; }
  .d1w-timeline-list::before { left: 45px; }
  .d1w-timeline-label { font-size: 0.85rem; }
}

/* Money-back guarantee badge */
.d1w-mbg-block {
  margin-top: 1.2rem;
  padding: 0.7rem 1rem;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 8px;
  font-size: 0.85rem;
  color: #78350f;
  text-align: center;
}
/* Decisión founder 2026-06-12: la garantía pasa de banner llamativo a línea
   discreta tipo pie — se honra la promesa sin sembrar la salida en el plan. */
.d1w-mbg-block--discreet {
  margin-top: 1.4rem;
  padding: 0;
  background: transparent;
  border: none;
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
}
.d1w-mbg-link--discreet {
  background: none;
  border: none;
  padding: 0;
  font-size: var(--text-xs-plus);
  color: var(--ink-mute);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  font-weight: 500;
}
.d1w-mbg-link--discreet:hover { color: var(--ink-soft); }
.d1w-mbg-icon { color: #d97706; margin-right: 0.4rem; }
.d1w-mbg-text { line-height: 1.5; }
.d1w-mbg-link {
  color: #b45309;
  text-decoration: underline;
  cursor: pointer;
  font-weight: 600;
}

/* Override banner — confirm tone (verde-grisaceo sutil) cuando weight=1.0 */
.override-banner-confirm { box-shadow: 0 2px 8px rgba(16, 185, 129, 0.08); }
.override-banner-soft_override { box-shadow: 0 4px 12px rgba(217, 119, 6, 0.12); }
.override-banner-hard_override { box-shadow: 0 6px 18px rgba(194, 65, 12, 0.18); }

/* Mobile breakpoints 640/480 */
@media (max-width: 640px) {
  .sprint-thesis-inner { padding: 0.75rem 0.9rem; }
  .sprint-thesis-text { font-size: 0.95rem; }
  .recovery-card-inner { padding: 0.85rem 0.9rem; }
  .recovery-title { font-size: 0.95rem; }
  .recovery-friction-chips { gap: 0.3rem; }
  .recovery-chip { padding: 0.3rem 0.65rem; font-size: 0.78rem; }
  .pattern-mirror-inner { padding: 0.85rem 0.95rem; }
  .pattern-mirror-label { font-size: 0.95rem; }
  .d1w-thesis-block { padding: 0.8rem 0.9rem; }
  .d1w-thesis-text { font-size: 0.95rem; }
  .d1w-hallazgos-list li { font-size: 0.88rem; }
}
@media (max-width: 480px) {
  .sprint-thesis-chip, .sprint-thesis-forbidden,
  .d1w-thesis-chip, .pattern-mirror-chip {
    font-size: 0.7rem; padding: 0.18rem 0.5rem;
  }
  .recovery-friction-chips { flex-direction: column; }
  .recovery-chip { width: 100%; text-align: center; }
  .pattern-mirror-actions { flex-direction: column; }
  .pattern-mirror-btn { width: 100%; }
}

/* M4 Sprint30 Premium Cierre 2026-05 — Policy view en User Profile Continuity */
.upc-section-policy { background: #f8fafc; border-left: 3px solid #6366f1; border-radius: 6px; padding: 0.75rem 0.9rem; margin: 0.75rem 0; }
.upc-pv-subtitle { font-size: 0.8rem; color: #64748b; margin: 0 0 0.55rem; font-style: italic; }
.upc-pv-list { display: flex; flex-direction: column; gap: 0.35rem; }
.upc-pv-item {
  font-size: 0.88rem;
  color: #334155;
  padding: 0.3rem 0.5rem;
  background: #ffffff;
  border-radius: 5px;
}
.upc-pv-label { font-weight: 600; color: #1e293b; }
.upc-pv-value { color: #475569; }
.upc-pv-forbidden { background: #fef2f2; border-left: 2px solid #f87171; }
.upc-pv-forbidden .upc-pv-label { color: #991b1b; }

/* G7 Sprint30 Premium Cierre 2026-05 — Mentor reasoning bullets coloreados
   + diagnostico enriched ("hoy cambia por lo de ayer"). */
.mentor-reasoning-bullet--dato { border-left: 3px solid #94a3b8; padding-left: 0.65rem; }
.mentor-reasoning-bullet--diagnostico { border-left: 3px solid #f97316; padding-left: 0.65rem; }
.mentor-reasoning-bullet--prescripcion { border-left: 3px solid #2563eb; padding-left: 0.65rem; }
.mentor-reasoning-bullet--dato .mr-tag-dato { background: #f1f5f9; color: #475569; }
.mentor-reasoning-bullet--diagnostico .mr-tag-diag { background: #fff7ed; color: #c2410c; }
.mentor-reasoning-bullet--prescripcion .mr-tag-pres { background: #eff6ff; color: #1d4ed8; }

.diagnostico-enriched-block {
  margin-top: 0.85rem;
  padding: 0.7rem 0.85rem;
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border-left: 3px solid #f59e0b;
  border-radius: 6px;
}
.diagnostico-enriched-label {
  font-size: 0.78rem;
  font-weight: 700;
  color: #92400e;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.3rem;
}
.diagnostico-enriched-text {
  font-size: 0.92rem;
  line-height: 1.5;
  color: #451a03;
}

/* G5 Sprint30 Premium Cierre 2026-05 — baseline inflated asterisco
   Cuando un sub-estado vino declarado del intake (no validado por ejecucion),
   pintamos un asterisco discreto con tooltip explicativo. */
.subestado-inflated {
  display: inline-block;
  margin-left: 0.2em;
  color: #d97706;
  font-weight: 700;
  cursor: help;
  font-size: 1.05em;
  vertical-align: super;
  font-size: 0.85em;
  line-height: 1;
}
.subestado-inflated:hover { color: #b45309; }

/* ============================================================================
   G3 Sprint30 Premium Cierre 2026-05 — Pattern Broken Celebration
   ============================================================================
   Overlay premium 1x por pattern roto. Slide-in suave + checkmark grande +
   copy positivo. Sin confetti (cuidamos la sensacion premium, no infantil). */
.pattern-broken-celebration {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.65);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: var(--z-premium-celebration);
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  padding: 1.25rem;
}
.pattern-broken-celebration.pattern-broken-visible { opacity: 1; }
.pattern-broken-card {
  background: linear-gradient(135deg, #ffffff 0%, #ecfdf5 100%);
  border-radius: 16px;
  padding: 2rem 1.75rem;
  max-width: 460px;
  width: 100%;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.25), 0 0 0 1px rgba(16, 185, 129, 0.18);
  text-align: center;
  transform: translateY(20px) scale(0.96);
  opacity: 0;
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1) 0.05s, opacity 0.45s ease 0.05s;
}
.pattern-broken-celebration.pattern-broken-visible .pattern-broken-card {
  transform: translateY(0) scale(1);
  opacity: 1;
}
.pattern-broken-checkmark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  background: #10b981;
  color: #ffffff;
  border-radius: 50%;
  font-size: 1.85rem;
  font-weight: 700;
  margin: 0 auto 1rem;
  box-shadow: 0 8px 20px rgba(16, 185, 129, 0.35);
  animation: pattern-broken-pulse 1.8s ease-in-out infinite;
}
@keyframes pattern-broken-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}
.pattern-broken-title {
  font-size: 1.2rem;
  font-weight: 700;
  color: #065f46;
  margin-bottom: 0.4rem;
}
.pattern-broken-pattern {
  font-size: 1rem;
  font-weight: 600;
  color: #047857;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 0.75rem;
}
.pattern-broken-explanation {
  font-size: 0.92rem;
  color: #1f2937;
  line-height: 1.5;
  margin-bottom: 1.25rem;
}
.pattern-broken-btn {
  appearance: none;
  border: none;
  background: linear-gradient(135deg, #047857 0%, #10b981 100%);
  color: #ffffff;
  font-weight: 600;
  font-size: 0.95rem;
  padding: 0.65rem 1.5rem;
  border-radius: 999px;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  box-shadow: 0 4px 12px rgba(4, 120, 87, 0.28);
}
.pattern-broken-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(4, 120, 87, 0.36); }
.pattern-broken-btn:disabled { opacity: 0.7; cursor: default; transform: none; }
@media (max-width: 640px) {
  .pattern-broken-card { padding: 1.5rem 1.25rem; }
  .pattern-broken-checkmark { width: 56px; height: 56px; font-size: 1.65rem; }
  .pattern-broken-title { font-size: 1.05rem; }
  .pattern-broken-pattern { font-size: 0.9rem; }
}

/* ============================================================================
   B FE Sprint30 Premium 2026-05 — Mentor Reasoning premium + no_hoy card roja
   ============================================================================ */

/* (1) no_hoy convertido a card destacada roja con icon prohibicion */
.no-hoy-card {
  margin: 1rem 0 1.1rem;
  padding: 0.9rem 1.05rem;
  background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
  border-left: 4px solid #dc2626;
  border-radius: 10px;
  box-shadow: 0 3px 12px rgba(220, 38, 38, 0.08);
}
.no-hoy-card-head {
  display: flex; align-items: center; gap: 0.55rem;
  margin-bottom: 0.6rem;
}
.no-hoy-card-icon {
  font-size: 1.3rem; line-height: 1;
  filter: hue-rotate(-5deg) saturate(1.1);
}
.no-hoy-card-title {
  font-size: 0.95rem; font-weight: 700;
  color: #7f1d1d; text-transform: uppercase;
  letter-spacing: 0.05em;
}
.no-hoy-card-list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 0.4rem;
}
.no-hoy-card-list li {
  display: flex; align-items: flex-start; gap: 0.55rem;
  padding: 0.4rem 0.6rem;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 6px;
  border-left: 2px solid #f87171;
}
.no-hoy-card-x {
  color: #dc2626; font-weight: 800; font-size: 0.9rem;
  flex: 0 0 auto; line-height: 1.6;
}
.no-hoy-card-text {
  color: #991b1b; font-size: 0.92rem; line-height: 1.5;
  font-weight: 500;
}

/* (2) Mentor Reasoning Premium upgrade — 3 sub-cards distintos por color */
.mentor-reasoning-premium .mentor-reasoning-body {
  display: flex; flex-direction: column; gap: 0.5rem;
}
.mr-line {
  display: flex; flex-direction: column; gap: 0.3rem;
  padding: 0.65rem 0.85rem;
  border-radius: 8px;
  background: #fafafa;
  border-left: 3px solid transparent;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.mr-line:hover { transform: translateX(2px); }
.mr-line.mr-dato {
  background: linear-gradient(90deg, rgba(37,99,235,0.04) 0%, rgba(37,99,235,0.01) 100%);
  border-left-color: #2563eb;
}
.mr-line.mr-diag {
  background: linear-gradient(90deg, rgba(245,158,11,0.05) 0%, rgba(245,158,11,0.01) 100%);
  border-left-color: #d97706;
}
.mr-line.mr-pres {
  background: linear-gradient(90deg, rgba(15,157,116,0.05) 0%, rgba(15,157,116,0.01) 100%);
  border-left-color: #10b981;
}
.mr-tag {
  font-size: 0.7rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.08em;
  padding: 0.18rem 0.55rem;
  border-radius: 4px;
  align-self: flex-start;
  display: inline-flex; align-items: center;
}
.mr-line .mr-text {
  color: #1e293b; font-size: 0.9rem; line-height: 1.55;
}

/* Mobile breakpoints */
@media (max-width: 640px) {
  .no-hoy-card { padding: 0.75rem 0.85rem; }
  .no-hoy-card-title { font-size: 0.88rem; }
  .no-hoy-card-text { font-size: 0.88rem; }
  .mr-line { padding: 0.55rem 0.7rem; }
}
@media (max-width: 480px) {
  .no-hoy-card-list li { padding: 0.3rem 0.5rem; }
}

/* ============================================================================
   E FE Sprint30 Premium 2026-05 — Weekly Review modal (dia 8/15/22/29)
   ============================================================================ */
.weekly-review-overlay {
  position: fixed; inset: 0;
  background: rgba(15, 23, 42, 0.75);
  backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  z-index: var(--z-premium-overlay);
  padding: 1rem;
  opacity: 0; animation: wr-fadein 0.4s forwards;
}
@keyframes wr-fadein { to { opacity: 1; } }

.wr-card {
  width: min(640px, 100%);
  max-height: 92vh;
  overflow-y: auto;
  background: #fff;
  border-radius: 16px;
  padding: 1.5rem 1.6rem;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.35);
  position: relative;
  transform: translateY(20px);
  animation: wr-slidein 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}
@keyframes wr-slidein { to { transform: translateY(0); } }

.wr-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  margin-bottom: 1.2rem;
}
.wr-title {
  font-size: 1.45rem; font-weight: 700;
  color: #0f172a; margin: 0;
  letter-spacing: -0.02em;
}
.wr-close-btn {
  background: none; border: none;
  font-size: 1.8rem; line-height: 1;
  color: #64748b; cursor: pointer;
  padding: 0.2rem 0.5rem; border-radius: 6px;
  transition: background 0.2s;
}
.wr-close-btn:hover { background: #f1f5f9; }

/* Tone-based accent. */
.weekly-review-tone-celebratory .wr-card {
  border-top: 4px solid #10b981;
}
.weekly-review-tone-honest .wr-card {
  border-top: 4px solid #6366f1;
}
.weekly-review-tone-supportive .wr-card {
  border-top: 4px solid #d97706;
}

.wr-exec-block {
  text-align: center;
  padding: 1.2rem 1rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
  margin-bottom: 1rem;
}
.weekly-review-tone-celebratory .wr-exec-block {
  background: linear-gradient(135deg, #f0fdf4 0%, #d1fae5 100%);
}
.weekly-review-tone-supportive .wr-exec-block {
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
}
.wr-exec-label {
  font-size: 0.78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.08em;
  color: #475569; margin-bottom: 0.4rem;
}
.wr-exec-value {
  font-size: 2.6rem; font-weight: 800;
  color: #0f172a; line-height: 1;
}
.wr-exec-sub {
  font-size: 0.85rem; color: #64748b; margin-top: 0.4rem;
}

.wr-metric-block {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: 0.85rem 1rem;
  background: #fafafa;
  border-radius: 8px;
  margin-bottom: 1rem;
  border-left: 3px solid #4f46e5;
}
.wr-metric-label {
  font-size: 0.78rem; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: #475569;
}
.wr-metric-value {
  font-size: 1.3rem; font-weight: 700; color: #1e293b;
}
.wr-metric-unit {
  font-size: 0.85rem; font-weight: 500; color: #64748b;
  margin-left: 0.3rem;
}

.wr-patron {
  padding: 0.65rem 0.9rem;
  background: #fef3c7;
  border-left: 3px solid #d97706;
  border-radius: 6px;
  font-size: 0.88rem;
  margin-bottom: 1rem;
  color: #78350f;
}
.wr-patron-label { font-weight: 700; text-transform: uppercase; font-size: 0.74rem; letter-spacing: 0.06em; }
.wr-patron-id { font-family: monospace; font-weight: 600; }

.wr-section {
  padding: 0.85rem 1rem;
  border-radius: 8px;
  margin-bottom: 0.8rem;
}
.wr-section-good { background: #f0fdf4; border-left: 3px solid #10b981; }
.wr-section-bad { background: #fef2f2; border-left: 3px solid #ef4444; }
.wr-section-cambio { background: #eef2ff; border-left: 3px solid #6366f1; }
.wr-section-title {
  font-size: 0.78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  margin-bottom: 0.4rem;
}
.wr-section-good .wr-section-title { color: #064e3b; }
.wr-section-bad .wr-section-title { color: #7f1d1d; }
.wr-section-cambio .wr-section-title { color: #312e81; }
.wr-section-list {
  margin: 0; padding-left: 1.2rem;
  font-size: 0.92rem; line-height: 1.55;
  color: #334155;
}
.wr-section-list li { padding: 0.15rem 0; }
.wr-section-text {
  font-size: 0.93rem; line-height: 1.55; color: #334155;
}

.wr-foco-block {
  padding: 0.85rem 1rem;
  background: linear-gradient(135deg, #1e293b 0%, #312e81 100%);
  color: #f8fafc;
  border-radius: 8px;
  margin-bottom: 1rem;
}
.wr-foco-row {
  display: flex; align-items: baseline; gap: 0.55rem;
  padding: 0.25rem 0;
  font-size: 0.9rem;
}
.wr-foco-label {
  font-weight: 700; text-transform: uppercase;
  font-size: 0.72rem; letter-spacing: 0.06em;
  color: #fde68a;
  flex: 0 0 auto;
}
.wr-foco-value { color: #f8fafc; font-weight: 500; }
.wr-foco-out .wr-foco-label { color: #fca5a5; }

.wr-actions {
  display: flex; gap: 0.6rem;
  margin-top: 1.2rem;
  flex-wrap: wrap;
}
.wr-btn {
  padding: 0.7rem 1.1rem;
  border-radius: 8px;
  font-size: 0.92rem; font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.2s;
  flex: 1 1 auto;
}
.wr-btn-primary {
  background: #4f46e5; color: #fff;
  border-color: #4338ca;
}
.wr-btn-primary:hover { background: #4338ca; transform: translateY(-1px); }
.wr-btn-secondary {
  background: #f1f5f9; color: #475569;
  border-color: #cbd5e1;
}
.wr-btn-secondary:hover { background: #e2e8f0; }

/* Mobile */
@media (max-width: 640px) {
  .wr-card { padding: 1.1rem 1.1rem; max-height: 95vh; }
  .wr-title { font-size: 1.2rem; }
  .wr-exec-value { font-size: 2.1rem; }
  .wr-metric-block { flex-direction: column; gap: 0.3rem; align-items: flex-start; }
  .wr-actions { flex-direction: column; }
  .wr-btn { width: 100%; }
}

/* ============================================================================
   F FE Sprint30 Premium 2026-05 — Tab Microcycles visual mejorado
   ============================================================================ */
.mlog-empty { padding: 2rem; text-align: center; color: #6b7280; }
.mlog-header { margin-bottom: 1.3rem; }
.mlog-title { margin: 0 0 0.4rem; font-size: 1.45rem; color: #0f172a; font-weight: 700; letter-spacing: -0.02em; }
.mlog-subtitle { margin: 0; color: #64748b; font-size: 0.95rem; line-height: 1.5; }

.mlog-empty-state {
  padding: 2.5rem 1.5rem;
  text-align: center;
  background: #f8fafc;
  border-radius: 14px;
  margin-top: 1rem;
}
.mlog-empty-icon { font-size: 3rem; margin-bottom: 0.8rem; }
.mlog-empty-title { font-size: 1.1rem; font-weight: 700; color: #1e293b; margin-bottom: 0.5rem; }
.mlog-empty-body { font-size: 0.92rem; color: #64748b; max-width: 480px; margin: 0 auto; line-height: 1.5; }

/* Totales con percentages */
.mlog-totals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}
.mlog-stat {
  padding: 1rem 1.1rem;
  border-radius: 12px;
  border: 1px solid transparent;
  background: #f9fafb;
}
.mlog-stat-confirm { background: #f0fdf4; border-color: #86efac; }
.mlog-stat-pivot { background: #fffbeb; border-color: #fcd34d; }
.mlog-stat-drop { background: #f9fafb; border-color: #d1d5db; }
.mlog-stat-total { background: #eef2ff; border-color: #c7d2fe; }
.mlog-stat-label {
  font-size: 0.72rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.07em;
  margin-bottom: 0.35rem;
}
.mlog-stat-confirm .mlog-stat-label { color: #166534; }
.mlog-stat-pivot .mlog-stat-label { color: #92400e; }
.mlog-stat-drop .mlog-stat-label { color: #374151; }
.mlog-stat-total .mlog-stat-label { color: #3730a3; }
.mlog-stat-value { font-size: 1.8rem; font-weight: 800; line-height: 1; }
.mlog-stat-confirm .mlog-stat-value { color: #14532d; }
.mlog-stat-pivot .mlog-stat-value { color: #7c2d12; }
.mlog-stat-drop .mlog-stat-value { color: #1f2937; }
.mlog-stat-total .mlog-stat-value { color: #1e1b4b; }
.mlog-stat-pct {
  font-size: 0.82rem; font-weight: 600;
  color: #64748b; margin-top: 0.25rem;
}

/* Histograma CSS-only: barra horizontal con 3 segmentos */
.mlog-histogram-block {
  margin-bottom: 1.4rem;
  padding: 1rem 1.1rem;
  background: #fafafa;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
}
.mlog-histogram-title {
  font-size: 0.82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: #475569; margin-bottom: 0.6rem;
}
.mlog-histogram-bar {
  display: flex; width: 100%; height: 32px;
  border-radius: 8px; overflow: hidden;
  background: #f1f5f9;
}
.mlog-histogram-seg {
  display: flex; align-items: center; justify-content: center;
  font-size: 0.78rem; font-weight: 700; color: #fff;
  transition: all 0.4s ease;
}
.mlog-histogram-confirm { background: linear-gradient(90deg, #16a34a 0%, #15803d 100%); }
.mlog-histogram-pivot { background: linear-gradient(90deg, #d97706 0%, #b45309 100%); }
.mlog-histogram-drop { background: linear-gradient(90deg, #6b7280 0%, #4b5563 100%); }

.mlog-histogram-legend {
  display: flex; flex-wrap: wrap; gap: 0.85rem;
  margin-top: 0.6rem;
  font-size: 0.78rem; color: #475569;
}
.mlog-legend-item { display: inline-flex; align-items: center; gap: 0.35rem; }
.mlog-legend-dot {
  display: inline-block; width: 10px; height: 10px;
  border-radius: 50%;
}
.mlog-legend-confirm { background: #16a34a; }
.mlog-legend-pivot { background: #d97706; }
.mlog-legend-drop { background: #6b7280; }

/* Filter buttons */
.mlog-filters {
  display: flex; flex-wrap: wrap; gap: 0.4rem;
  margin-bottom: 1rem;
}
.mlog-filter-btn {
  padding: 0.4rem 0.85rem;
  border-radius: 999px;
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #475569;
  font-size: 0.82rem; font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}
.mlog-filter-btn:hover { background: #f1f5f9; }
.mlog-filter-btn.is-active {
  background: #1e293b; color: #fff; border-color: #0f172a;
}

/* Recent cards expandibles */
.mlog-recent-title { margin: 0 0 0.8rem; color: #0f172a; font-size: 1.05rem; font-weight: 700; }
.mlog-recent-list { display: flex; flex-direction: column; gap: 0.6rem; }
.mlog-no-recent { color: #6b7280; font-style: italic; }

.mlog-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}
.mlog-card:hover { box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06); }
.mlog-card-confirm { border-left: 3px solid #16a34a; }
.mlog-card-pivot { border-left: 3px solid #d97706; }
.mlog-card-drop { border-left: 3px solid #6b7280; }
.mlog-card-head {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.75rem 0.95rem;
  cursor: pointer;
  flex-wrap: wrap;
}
.mlog-cycle-label { color: #111827; font-size: 0.95rem; flex: 1 1 auto; }
.mlog-decision-badge {
  color: #fff; padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.72rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.05em;
}
.mlog-badge-confirm { background: #16a34a; }
.mlog-badge-pivot { background: #d97706; }
.mlog-badge-drop { background: #6b7280; }
.mlog-badge-none { background: #94a3b8; }
.mlog-expand-caret {
  color: var(--ink-mute); font-size: 0.9rem;
  transition: transform 0.2s ease;
}
.mlog-card.mlog-expanded .mlog-expand-caret { transform: rotate(180deg); color: #4f46e5; }

.mlog-card-body {
  padding: 0 0.95rem 0.85rem;
  max-height: 0; overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s ease;
}
.mlog-card.mlog-expanded .mlog-card-body {
  max-height: 600px;
  padding-top: 0.45rem;
}

.mlog-hypothesis, .mlog-metric {
  padding: 0.4rem 0;
  font-size: 0.88rem; color: #334155; line-height: 1.5;
}
.mlog-hyp-label, .mlog-met-label {
  font-weight: 700; color: #1e293b;
  text-transform: uppercase; font-size: 0.72rem;
  letter-spacing: 0.05em;
}
.mlog-decision-reason {
  padding: 0.45rem 0.7rem;
  margin: 0.5rem 0;
  background: #f8fafc;
  border-left: 2px solid #cbd5e1;
  border-radius: 4px;
  font-size: 0.85rem;
  color: #475569;
  font-style: italic;
}

.mlog-av-block {
  margin-top: 0.6rem;
  padding: 0.6rem 0.75rem;
  background: #fafafa;
  border-radius: 6px;
}
.mlog-av-title {
  font-size: 0.74rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: #475569; margin-bottom: 0.4rem;
}
.mlog-av-row {
  display: flex; justify-content: space-between;
  padding: 0.25rem 0; font-size: 0.85rem;
  border-bottom: 1px dashed #e5e7eb;
}
.mlog-av-row:last-child { border-bottom: none; }
.mlog-av-label { color: #334155; }
.mlog-av-pct { font-weight: 700; }
.mlog-av-ok .mlog-av-pct { color: #16a34a; }
.mlog-av-soft .mlog-av-pct { color: #d97706; }
.mlog-av-bad .mlog-av-pct { color: #dc2626; }

/* Mobile */
@media (max-width: 640px) {
  .mlog-totals { grid-template-columns: repeat(2, 1fr); gap: 0.5rem; }
  .mlog-stat { padding: 0.75rem 0.85rem; }
  .mlog-stat-value { font-size: 1.5rem; }
  .mlog-histogram-bar { height: 24px; }
  .mlog-histogram-seg { font-size: 0.68rem; }
  .mlog-filters { gap: 0.3rem; }
  .mlog-filter-btn { padding: 0.3rem 0.65rem; font-size: 0.78rem; }
}
@media (max-width: 480px) {
  .mlog-totals { grid-template-columns: 1fr 1fr; }
  .mlog-card-head { flex-direction: column; align-items: flex-start; gap: 0.3rem; }
}

/* ============================================================================
   G FE Sprint30 Premium 2026-05 — User Profile Continuity (Free->Map->Sprint)
   ============================================================================ */
.user-profile-continuity-panel { margin-top: 1.5rem; }
.user-profile-continuity-panel.hidden { display: none; }

.upc-collapse {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}
.upc-collapse:hover { box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05); }
.upc-collapse[open] { box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08); }

.upc-collapse-head {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.85rem 1.05rem;
  cursor: pointer;
  list-style: none;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
}
.upc-collapse-head::-webkit-details-marker { display: none; }
.upc-collapse-icon { font-size: 1.1rem; color: #4f46e5; }
.upc-collapse-title { flex: 1; font-weight: 700; color: #1e293b; font-size: 0.98rem; }
.upc-collapse-caret { color: #94a3b8; transition: transform 0.2s; }
.upc-collapse[open] .upc-collapse-caret { transform: rotate(180deg); color: #4f46e5; }

.upc-collapse-body { padding: 1rem 1.1rem 1.2rem; }
.upc-subtitle { color: #64748b; font-size: 0.88rem; margin: 0 0 1rem; }

.upc-section {
  margin-top: 1rem;
  padding: 0.85rem 1rem;
  border-radius: 10px;
}
.upc-section:first-child { margin-top: 0; }
.upc-section-title {
  margin: 0 0 0.6rem;
  font-size: 0.78rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.06em;
  color: #1e293b;
}

.upc-section-isp { background: #f8fafc; border-left: 3px solid #6366f1; }
.upc-isp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.55rem 1rem;
}
.upc-isp-item { font-size: 0.88rem; line-height: 1.5; }
.upc-isp-label { color: #475569; font-weight: 600; }
.upc-isp-value { color: #1e293b; }

.upc-section-gap {
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border-left: 3px solid #d97706;
}
.upc-gap-row {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0.7rem;
  align-items: stretch;
}
.upc-gap-side { padding: 0.5rem 0.7rem; background: #fff; border-radius: 6px; border: 1px solid #fcd34d; }
.upc-gap-stated { border-color: #fdba74; }
.upc-gap-actual { border-color: #86efac; background: #f0fdf4; }
.upc-gap-label {
  font-size: 0.72rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: #92400e; margin-bottom: 0.25rem;
}
.upc-gap-actual .upc-gap-label { color: #166534; }
.upc-gap-value { font-size: 0.92rem; color: #1e293b; line-height: 1.45; }
.upc-gap-arrow {
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; color: #d97706;
}
.upc-gap-narrative {
  margin-top: 0.6rem;
  padding: 0.5rem 0.7rem;
  background: #fff;
  border-radius: 6px;
  font-size: 0.85rem; color: #475569; font-style: italic;
}

.upc-section-map {
  background: #ecfdf5;
  border-left: 3px solid #059669;
}
.upc-section-seed {
  background: #f0f9ff;
  border-left: 3px solid #0284c7;
}
.upc-map-meta, .upc-map-hyp, .upc-map-metric, .upc-map-stop,
.upc-seed-hyp, .upc-seed-metric, .upc-seed-week1, .upc-seed-stop {
  font-size: 0.88rem; color: #334155; line-height: 1.55;
  padding: 0.2rem 0;
}
.upc-map-meta { font-weight: 600; color: #064e3b; }
.upc-seed-note {
  padding: 0.45rem 0.65rem;
  background: #fff;
  border-radius: 6px;
  font-size: 0.82rem; color: #0c4a6e;
  margin-bottom: 0.55rem;
  border: 1px dashed #bae6fd;
}
.upc-note {
  margin-top: 0.55rem;
  font-size: 0.82rem; color: #475569; font-style: italic;
}
.upc-map-pdf-btn {
  margin-top: 0.7rem;
  padding: 0.55rem 0.9rem;
  border-radius: 6px;
  border: 1px solid #059669;
  background: #fff;
  color: #064e3b;
  font-size: 0.85rem; font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
}
.upc-map-pdf-btn:hover {
  background: #ecfdf5; transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(5, 150, 105, 0.15);
}
.upc-mini-label {
  font-weight: 700; color: #1e293b;
  text-transform: uppercase; font-size: 0.7rem;
  letter-spacing: 0.05em;
}

/* Mobile */
@media (max-width: 640px) {
  .upc-isp-grid { grid-template-columns: 1fr; }
  .upc-gap-row { grid-template-columns: 1fr; }
  .upc-gap-arrow { transform: rotate(90deg); padding: 0.3rem 0; }
  .upc-collapse-head { padding: 0.7rem 0.85rem; }
}

/* ============================================================
   Execution Map v4 M9 (2026-05-16) — Premium context layer.
   renderFreeValueLayer3Acts(layer, {context:"map_paid"}) renders
   over the Map tabs with shift de tono + bloques extra exclusivos.
   Gradient border indigo→gold + watermark + reveal staggered.
   ============================================================ */
.flv-root--paid.is-premium-context {
  position: relative;
  padding: 1.6rem 1.4rem 1.4rem;
  margin: 1.2rem 0 1.4rem;
  border-radius: 16px;
  background-color: #ffffff;
  /* Gradient border indigo→gold (Safari fallback abajo). */
  border: 2px solid transparent;
  background-image:
    linear-gradient(#ffffff, #ffffff),
    linear-gradient(135deg, #4f46e5 0%, #b48e32 100%);
  background-origin: border-box;
  background-clip: padding-box, border-box;
  box-shadow: 0 8px 24px -10px rgba(79, 70, 229, 0.18);
  overflow: hidden;
}
.flv-root--paid.is-premium-context::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 92% 8%, rgba(180, 142, 50, 0.06) 0, transparent 38%),
    radial-gradient(circle at 8% 92%, rgba(79, 70, 229, 0.04) 0, transparent 42%);
  opacity: 1;
  z-index: 0;
}
.flv-root--paid.is-premium-context > * { position: relative; z-index: 1; }

/* Mini-card "↑ This is what you paid for" */
.flv-paid-topcard {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.85rem;
  margin: 0 0 1rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #eef2ff 0%, #fef3c7 100%);
  border: 1px solid #c7d2fe;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #1e1b4b;
}
.flv-paid-topcard-arrow { font-size: 1rem; color: #4338ca; }
.flv-paid-topcard-text { color: #1e1b4b; }

/* Bloques extra después del Acto 3 */
.flv-paid-extras {
  margin-top: 1.6rem;
  padding-top: 1.4rem;
  border-top: 1px dashed #c7d2fe;
  display: flex;
  flex-direction: column;
  gap: 1.05rem;
  animation: flv-paid-stagger 800ms ease-out both;
}
.flv-paid-block {
  padding: 0.9rem 1rem;
  border-radius: 10px;
  background: #f8fafc;
  border-left: 3px solid #4f46e5;
}
.flv-paid-block--brief { border-left-color: #4f46e5; }
.flv-paid-block--traps { border-left-color: #b48e32; background: #fffbeb; }
.flv-paid-block--vertical { border-left-color: #047857; background: #f0fdf4; }
.flv-paid-block-label {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #475569;
  margin-bottom: 0.45rem;
}
.flv-paid-block-body {
  font-size: 0.92rem;
  line-height: 1.5;
  color: #1f2937;
}
.flv-paid-block-cta { margin-top: 0.55rem; }
.flv-paid-cta-link {
  font-size: 0.85rem;
  font-weight: 600;
  color: #4338ca;
  text-decoration: none;
  border-bottom: 1px dashed #c7d2fe;
}
.flv-paid-cta-link:hover { color: #312e81; border-bottom-color: #4338ca; }

/* Failure traps list inside paid layer */
.flv-paid-traps-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.flv-paid-trap-item {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 0.9rem;
  line-height: 1.45;
  color: #92400e;
}
.flv-paid-trap-week-badge {
  flex: 0 0 auto;
  padding: 0.15rem 0.55rem;
  border-radius: 6px;
  background: #b48e32;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.flv-paid-trap-title { color: #78350f; }

/* Vertical benchmark rows */
.flv-paid-vb-row {
  display: block;
  font-size: 0.88rem;
  line-height: 1.5;
  color: #064e3b;
  margin-bottom: 0.25rem;
}
.flv-paid-vb-row strong { color: #022c22; }

/* Final badge "PAID EXECUTION MAP · Read with intent" */
.flv-paid-badge {
  align-self: flex-start;
  margin-top: 0.4rem;
  padding: 0.55rem 1rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #4338ca 0%, #b48e32 100%);
  color: #fffaf0;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  box-shadow: 0 4px 12px -4px rgba(67, 56, 202, 0.4);
}

/* Stagger reveal animation */
@keyframes flv-paid-stagger {
  0%   { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Reduced motion: respeta preferencia del usuario */
@media (prefers-reduced-motion: reduce) {
  .flv-paid-extras { animation: none; }
}

/* Safari < 14 fallback: si el gradient border no aplica, mostramos border indigo. */
@supports not (background-clip: padding-box, border-box) {
  .flv-root--paid.is-premium-context {
    background-image: none;
    border: 2px solid #4f46e5;
  }
}

/* Mobile breakpoints */
@media (max-width: 640px) {
  .flv-root--paid.is-premium-context { padding: 1.2rem 1rem 1.1rem; border-radius: 14px; }
  .flv-paid-block { padding: 0.8rem 0.85rem; }
  .flv-paid-trap-item { font-size: 0.85rem; }
}
@media (max-width: 480px) {
  .flv-paid-topcard { font-size: 0.72rem; padding: 0.35rem 0.7rem; }
  .flv-paid-badge { font-size: 0.68rem; padding: 0.5rem 0.85rem; }
}

/* ============================================================
   Execution Map v4 M4 (2026-05-16) — plateau_overlay block.
   Rendered ABOVE the decision_brief standard, purple tone.
   ============================================================ */
.mdt-block--plateau-overlay {
  margin: 0 0 1.2rem;
  padding: 1.1rem 1.15rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%);
  border-left: 4px solid #6b21a8;
  box-shadow: 0 4px 12px -6px rgba(107, 33, 168, 0.18);
}
.mdt-plateau-badge {
  display: inline-block;
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  background: #6b21a8;
  color: #faf5ff;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.7rem;
}
.mdt-plateau-sublabel {
  margin-top: 0.85rem !important;
  color: #581c87 !important;
}
.mdt-plateau-hypothesis {
  font-size: 0.98rem;
  line-height: 1.55;
  color: #3b0764;
  font-weight: 500;
  padding: 0.55rem 0.7rem;
  background: #fff;
  border-radius: 8px;
  border: 1px solid #d8b4fe;
  margin: 0.35rem 0 0.5rem;
}
.mdt-plateau-assumptions {
  margin: 0.35rem 0 0;
  padding-left: 1.1rem;
  color: #581c87;
  font-size: 0.9rem;
  line-height: 1.5;
}
.mdt-plateau-assumptions li { margin: 0.2rem 0; }
.mdt-plateau-weeks {
  margin: 0.35rem 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  font-size: 0.9rem;
  color: #4c1d95;
}
.mdt-plateau-weeks li {
  padding: 0.45rem 0.7rem;
  background: #fff;
  border-radius: 6px;
  border: 1px solid #e9d5ff;
}
.mdt-plateau-weeks strong { color: #6b21a8; }
.mdt-plateau-weeks em { color: #7e22ce; font-style: italic; }
.mdt-plateau-meta {
  margin-top: 0.7rem;
  font-size: 0.82rem;
  color: #6b21a8;
  letter-spacing: 0.01em;
}
.mdt-plateau-frontier-note {
  margin: 0.85rem 0 0;
  padding: 0.55rem 0.7rem;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 6px;
  font-size: 0.8rem;
  font-style: italic;
  color: #581c87;
  line-height: 1.4;
}

/* Mobile */
@media (max-width: 640px) {
  .mdt-block--plateau-overlay { padding: 0.95rem 0.85rem; }
  .mdt-plateau-badge { font-size: 0.65rem; }
  .mdt-plateau-hypothesis { font-size: 0.92rem; }
}

/* ============================================================
   Execution Map v4 F2.5 (2026-05-16) — engine_receipt.
   Renderizado dentro de <details> colapsado al final del tab Decision.
   Tono "receipt" sobrio: gris claro + monospace para campos tecnicos.
   ============================================================ */
.mdt-engine-receipt {
  margin: 1.2rem 0 0;
  padding: 0.85rem 1rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px dashed #cbd5e1;
}
.mdt-engine-receipt summary {
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 600;
  color: #475569;
  letter-spacing: 0.01em;
  user-select: none;
}
.mdt-engine-receipt summary:hover { color: #1e293b; }
.mdt-engine-receipt[open] summary { margin-bottom: 0.7rem; }
.mdt-engine-receipt-body {
  font-size: 0.85rem;
  line-height: 1.55;
  color: #475569;
}
.mdt-engine-receipt-intro {
  margin: 0 0 0.4rem;
  font-style: italic;
  color: #64748b;
}
.mdt-engine-receipt-list {
  margin: 0.35rem 0 0.7rem;
  padding-left: 1.2rem;
  color: #334155;
}
.mdt-engine-receipt-list li { margin: 0.18rem 0; }
.mdt-engine-receipt-list code {
  background: #e2e8f0;
  padding: 0.05rem 0.35rem;
  border-radius: 4px;
  font-size: 0.78rem;
  color: #1e293b;
}
.mdt-engine-receipt-meta {
  margin: 0.25rem 0;
  font-size: 0.78rem;
  color: #64748b;
}
.mdt-engine-receipt-meta code {
  background: #f1f5f9;
  padding: 0.05rem 0.3rem;
  border-radius: 4px;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
.mdt-engine-receipt-caveat {
  margin: 0.4rem 0 0;
  padding-top: 0.4rem;
  border-top: 1px dotted #cbd5e1;
  font-size: 0.75rem;
  color: var(--ink-mute);
}

/* M-PROPIA 3 (2026-05-16): alternatives_considered dentro de engine_receipt. */
.mdt-er-alternatives {
  margin-top: 0.85rem;
  padding-top: 0.7rem;
  border-top: 1px dashed #cbd5e1;
}
.mdt-er-alt-title {
  margin: 0 0 0.3rem;
  font-size: 0.84rem;
  font-weight: 700;
  color: #0f172a;
}
.mdt-er-alt-intro {
  margin: 0 0 0.55rem;
  font-size: 0.78rem;
  color: #64748b;
  font-style: italic;
}
.mdt-er-alt-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}
.mdt-er-alt-item {
  padding: 0.5rem 0.65rem;
  border-radius: 6px;
  background: #ffffff;
  border-left: 2px solid #4f46e5;
  font-size: 0.81rem;
  line-height: 1.45;
  color: #334155;
}
.mdt-er-alt-item code {
  background: #eef2ff;
  padding: 0.05rem 0.3rem;
  border-radius: 4px;
  font-size: 0.76rem;
  color: #3730a3;
  font-family: ui-monospace, "SF Mono", Menlo, monospace;
}
.mdt-er-alt-confidence,
.mdt-er-alt-via,
.mdt-er-alt-options {
  display: inline-block;
  margin-left: 0.4rem;
  font-size: 0.76rem;
  color: #64748b;
}
.mdt-er-alt-evidence {
  margin-top: 0.25rem;
  font-size: 0.76rem;
  color: #64748b;
  font-style: italic;
  padding-left: 0.5rem;
}
.mdt-er-alt-rejected {
  margin-top: 0.2rem;
  font-size: 0.76rem;
  color: #b91c1c;
}

/* ============================================================
   Execution Map v4 F2.1 (2026-05-16) — engine_evidence_strip.
   Bullets premium que exhiben computacion del motor sobre el intake real.
   Free: appears after Acto 3. Map paid: appears at top of Decision tab.
   ============================================================ */
.eet-root {
  margin: 1.4rem 0;
  padding: 1.3rem 1.4rem;
  border-radius: 14px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid #cbd5e1;
  box-shadow: 0 2px 8px -3px rgba(15, 23, 42, 0.08);
}
.eet-root.eet-ctx-map_paid {
  background: linear-gradient(180deg, #fefce8 0%, #f8fafc 100%);
  border-color: #b48e32;
  border-left-width: 4px;
}
.eet-header { margin-bottom: 0.9rem; }
.eet-title {
  margin: 0 0 0.25rem;
  font-size: 1.04rem;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.005em;
}
.eet-subtitle {
  margin: 0;
  font-size: 0.85rem;
  color: #64748b;
  font-style: italic;
}
.eet-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
.eet-item {
  padding: 0.85rem 0.95rem;
  border-radius: 10px;
  background: #ffffff;
  border-left: 3px solid #94a3b8;
}
.eet-item.eet-sev-high { border-left-color: #dc2626; background: #fff7ed; }
.eet-item.eet-sev-medium { border-left-color: #b48e32; background: #fffbeb; }
.eet-item.eet-sev-low { border-left-color: #94a3b8; background: #f8fafc; }
.eet-headline {
  margin-bottom: 0.45rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: #1e293b;
}
.eet-bullet {
  color: #b48e32;
  font-size: 0.9rem;
  margin-right: 0.35rem;
}
.eet-item.eet-sev-high .eet-bullet { color: #dc2626; }
.eet-row {
  margin: 0.25rem 0;
  font-size: 0.86rem;
  line-height: 1.5;
  color: #334155;
}
.eet-row strong { color: #1e293b; }
.eet-row em { color: #64748b; }
.eet-row--quote { color: #475569; }
.eet-row--obs { color: #0f172a; font-weight: 500; }
.eet-row--why {
  margin-top: 0.45rem;
  padding-top: 0.4rem;
  border-top: 1px dashed #e2e8f0;
  font-size: 0.82rem;
  color: #64748b;
}

/* Mobile */
@media (max-width: 640px) {
  .eet-root { padding: 1.05rem 1rem; }
  .eet-item { padding: 0.75rem 0.85rem; }
  .eet-title { font-size: 0.98rem; }
  .eet-row, .eet-row--why { font-size: 0.82rem; }
}

/* ============================================================
   Execution Map v4 F2.2 (2026-05-16) — tier_stack value cards.
   4 cards side-by-side desktop, 1-col stack mobile <720px.
   Cada card lista deliverables tangibles de su tier.
   ============================================================ */
.tsk-root {
  margin: 1.4rem 0;
  padding: 1.5rem 1.4rem;
  border-radius: 14px;
  background: linear-gradient(180deg, #fafafa 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
}
.tsk-header {
  text-align: center;
  margin-bottom: 1.4rem;
}
.tsk-title {
  margin: 0 0 0.4rem;
  font-size: 1.18rem;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.01em;
}
.tsk-subtitle {
  margin: 0;
  font-size: 0.88rem;
  color: #64748b;
  font-style: italic;
}
.tsk-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.85rem;
}
.tsk-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 1rem 0.85rem 1rem;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.tsk-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px -4px rgba(15, 23, 42, 0.12);
}
.tsk-card--recommended {
  border-color: #4338ca;
  border-width: 2px;
  box-shadow: 0 4px 14px -4px rgba(79, 70, 229, 0.22);
}
.tsk-recommended-badge {
  position: absolute;
  top: -0.65rem;
  left: 50%;
  transform: translateX(-50%);
  padding: 0.2rem 0.7rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #4338ca 0%, #b48e32 100%);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* ============================================================
   M-PROPIA 6 (2026-05-16) — Launch price anchoring honesto.
   Precio original tachado ($99) + $47 destacado en gold + badge
   "PRECIO DE APERTURA · 53% OFF" con pulse sutil.
   EXECUTION_MAP_LAUNCH_PRICE_CENTS=4700 (real, no inventado).
   ============================================================ */
.tsk-card--launch-price {
  position: relative;
  border: 2px solid #b48e32;
  background: linear-gradient(180deg, #fffbeb 0%, #ffffff 50%);
  box-shadow: 0 4px 16px -6px rgba(180, 142, 50, 0.30);
  transform: translateY(-2px);
}
.tsk-card--launch-price:hover {
  box-shadow: 0 6px 20px -6px rgba(180, 142, 50, 0.40);
  transform: translateY(-4px);
}
.tsk-launch-badge {
  position: absolute;
  top: -0.7rem;
  left: 50%;
  transform: translateX(-50%);
  padding: 0.25rem 0.85rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #dc2626 0%, #b48e32 100%);
  color: #ffffff;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  box-shadow: 0 3px 10px -2px rgba(220, 38, 38, 0.40);
  animation: tsk-launch-pulse 2.4s ease-in-out infinite;
  z-index: var(--z-above);
}
@keyframes tsk-launch-pulse {
  0%, 100% {
    transform: translateX(-50%) scale(1);
    box-shadow: 0 3px 10px -2px rgba(220, 38, 38, 0.40);
  }
  50% {
    transform: translateX(-50%) scale(1.05);
    box-shadow: 0 5px 14px -2px rgba(220, 38, 38, 0.55);
  }
}
@media (prefers-reduced-motion: reduce) {
  .tsk-launch-badge { animation: none; }
}

/* Stack precio: tachado pequeño arriba + $47 grande abajo. */
.tsk-tier-price-group {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1;
}
.tsk-tier-price-strike {
  position: relative;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--ink-mute);
  text-decoration: line-through;
  text-decoration-thickness: 2px;
  text-decoration-color: #dc2626;
  margin-bottom: 0.15rem;
  letter-spacing: -0.01em;
}
.tsk-tier-price--launch {
  color: #b48e32 !important;
  font-size: 1.7rem;
  font-weight: 900;
  letter-spacing: -0.03em;
  text-shadow: 0 1px 2px rgba(180, 142, 50, 0.15);
}

/* Micro-copy debajo del precio: "Precio de apertura — sube a $99". */
.tsk-launch-micro {
  font-size: 0.72rem;
  color: #92400e;
  font-style: italic;
  margin: -0.4rem 0 0.75rem;
  padding: 0.25rem 0.45rem;
  background: rgba(254, 243, 199, 0.6);
  border-radius: 4px;
  border-left: 2px solid #f59e0b;
  text-align: center;
}

/* Mobile: badge un poco más compacto. */
@media (max-width: 720px) {
  .tsk-launch-badge { font-size: 0.58rem; padding: 0.2rem 0.65rem; }
  .tsk-tier-price--launch { font-size: 1.45rem; }
  .tsk-tier-price-strike { font-size: 0.85rem; }
  .tsk-launch-micro { font-size: 0.68rem; }
}
.tsk-card-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.4rem;
  margin-bottom: 0.15rem;
}
.tsk-tier-label {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #475569;
}
.tsk-tier-price {
  font-size: 1.4rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.02em;
}
.tsk-tier-status {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #16a34a;
}
.tsk-card--free .tsk-tier-label { color: #16a34a; }
.tsk-price-suffix {
  font-size: 0.74rem;
  color: #94a3b8;
  font-style: italic;
  margin-bottom: 0.75rem;
}
.tsk-bullets {
  margin: 0 0 0.95rem;
  padding: 0;
  list-style: none;
  flex: 1;
}
.tsk-bullets--checked .tsk-bullet::before {
  content: "✓ ";
  color: #16a34a;
  font-weight: 700;
  margin-right: 0.2rem;
}
.tsk-bullet {
  position: relative;
  padding: 0.35rem 0;
  padding-left: 0.85rem;
  font-size: 0.82rem;
  line-height: 1.4;
  color: #334155;
  border-bottom: 1px dotted #e2e8f0;
}
.tsk-bullets:not(.tsk-bullets--checked) .tsk-bullet::before {
  content: "›";
  position: absolute;
  left: 0;
  top: 0.35rem;
  color: #94a3b8;
  font-weight: 700;
}
.tsk-bullet:last-child { border-bottom: none; }
.tsk-cta {
  width: 100%;
  padding: 0.7rem 0.5rem;
  font-size: 0.88rem;
  font-weight: 600;
  margin-top: auto;
  margin-bottom: 0.6rem;
  border-radius: 8px;
  cursor: pointer;
}
.tsk-card-summary {
  margin: 0;
  padding-top: 0.55rem;
  border-top: 1px solid #e2e8f0;
  font-size: 0.75rem;
  color: #64748b;
  font-style: italic;
  line-height: 1.45;
}
.tsk-credit-anchor {
  margin: 1.3rem 0 0;
  padding: 0.65rem 0.85rem;
  border-radius: 8px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  font-size: 0.84rem;
  text-align: center;
  color: #065f46;
  font-weight: 500;
}
.tsk-frontier-note {
  margin: 0.65rem 0 0;
  text-align: center;
  font-size: 0.76rem;
  color: #94a3b8;
  font-style: italic;
}

/* Mobile: stack vertical */
@media (max-width: 1024px) {
  .tsk-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .tsk-grid { grid-template-columns: 1fr; }
  .tsk-card { padding: 0.95rem 0.85rem; }
  .tsk-tier-price { font-size: 1.25rem; }
  .tsk-bullet { font-size: 0.85rem; }
}

/* ============================================================
   Execution Map v4 F2.3 (2026-05-16) — post_map comparativa vivencial.
   3 columnas (Alone / + Sprint / + Momentum) en pantallaPostMap.
   Mobile <720px: stack vertical con border-acento por tier.
   ============================================================ */
.post-map-next-step {
  margin: 1.5rem 0;
  padding: 1.4rem 1.3rem;
  border-radius: 14px;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  border: 1px solid #cbd5e1;
}
.pmns-hero {
  text-align: center;
  margin-bottom: 1.3rem;
}
.pmns-hero-title {
  margin: 0;
  font-size: 1.12rem;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.005em;
  line-height: 1.4;
}
.pmns-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.85rem;
}
.pmns-col {
  display: flex;
  flex-direction: column;
  padding: 1.05rem 0.95rem;
  border-radius: 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
}
.pmns-col--alone {
  background: #f8fafc;
  border-color: #cbd5e1;
}
.pmns-col--sprint { border-left: 4px solid #4338ca; }
.pmns-col--momentum { border-left: 4px solid #b48e32; }
.pmns-col-header {
  margin-bottom: 0.85rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid #e2e8f0;
}
.pmns-col-label {
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #1e293b;
  text-transform: uppercase;
}
.pmns-col--alone .pmns-col-label { color: #64748b; }
.pmns-col--sprint .pmns-col-label { color: #4338ca; }
.pmns-col--momentum .pmns-col-label { color: #b48e32; }
.pmns-col-body {
  margin: 0.4rem 0;
  font-size: 0.86rem;
  line-height: 1.5;
  color: #334155;
  flex: 0;
}
.pmns-col-body strong { color: #0f172a; }
.pmns-col-body--attrition {
  margin-top: auto;
  padding-top: 0.7rem;
  border-top: 1px dashed #cbd5e1;
  font-size: 0.78rem;
  color: #94a3b8;
  font-style: italic;
}
.pmns-col-body--attrition sup { color: #64748b; font-weight: 700; }
.pmns-col-cta {
  width: 100%;
  margin-top: auto;
  padding: 0.65rem 0.6rem;
  font-size: 0.86rem;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
}
.pmns-deadline-anchor {
  margin: 1.3rem 0 0;
  padding: 0.85rem 1rem;
  border-radius: 10px;
  background: linear-gradient(135deg, #eef2ff 0%, #fef3c7 100%);
  border: 1px solid #c7d2fe;
  font-size: 0.88rem;
  line-height: 1.55;
  color: #1e1b4b;
  text-align: center;
}
.pmns-attrition-footnote {
  margin: 0.55rem 0 0;
  font-size: 0.72rem;
  color: #94a3b8;
  text-align: center;
  font-style: italic;
}

/* Execution Map (2026-06-01) — columna Sprint destacada como "siguiente paso
   sugerido" (honesto: NO es tier básico/avanzado, la diferencia es de horizonte). */
.pmns-col--recommended {
  position: relative;
  border: 1.5px solid #4338ca;
  border-left-width: 4px;
  box-shadow: 0 10px 28px -12px rgba(67, 56, 202, 0.45);
  transform: translateY(-4px);
  background: linear-gradient(180deg, #ffffff 0%, #f5f3ff 100%);
}
.pmns-col-suggested {
  position: absolute;
  top: -0.7rem;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  padding: 0.2rem 0.7rem;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #ffffff;
  background: linear-gradient(135deg, #4338ca 0%, #6d28d9 100%);
  border-radius: 999px;
  box-shadow: 0 4px 10px -3px rgba(67, 56, 202, 0.6);
}

/* Bisagra narrativa mapa → upsell: línea-gradiente sutil sobre el hero. */
.post-map-next-step .pmns-hero {
  position: relative;
  padding-top: 1.4rem;
  margin-top: 0.3rem;
}
.post-map-next-step .pmns-hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 64px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, #4338ca 0%, #b48e32 100%);
}

/* Reveal-on-scroll. El estado inicial oculto SOLO existe cuando JS lo armó
   (pmns-reveal-armed); sin JS el grid queda visible por default (nunca invisible). */
.post-map-next-step.pmns-reveal-armed .pmns-grid {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.post-map-next-step.pmns-reveal-armed .pmns-grid.pmns-revealed {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .pmns-col--recommended { transform: none; }
  .post-map-next-step.pmns-reveal-armed .pmns-grid {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Mobile */
@media (max-width: 720px) {
  .pmns-grid { grid-template-columns: 1fr; }
  .pmns-hero-title { font-size: 1rem; }
  .pmns-col--recommended { transform: none; }
}

/* ============================================================
   M-PROPIA 4 (2026-05-16) — Sprint anchoring matemático.
   "Ya avanzaste X% del Sprint" con progress bar indigo+gold.
   Cero invento: la matemática (Free=1d + Map=3d / 30d) es transparente.
   ============================================================ */
.sprint-anchor {
  margin: 1.4rem 0 1.2rem;
  padding: 1.1rem 1.25rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #ecfdf5 0%, #fef3c7 100%);
  border: 1px solid #a7f3d0;
  box-shadow: 0 2px 8px -3px rgba(16, 185, 129, 0.18);
}
.sprint-anchor-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #065f46;
  margin-bottom: 0.4rem;
}
.sprint-anchor-progress-text {
  font-size: 1.05rem;
  font-weight: 700;
  color: #064e3b;
  margin-bottom: 0.65rem;
  letter-spacing: -0.005em;
}
.sprint-anchor-bar {
  position: relative;
  width: 100%;
  height: 26px;
  border-radius: 999px;
  background: #d1fae5;
  overflow: hidden;
  margin-bottom: 0.65rem;
  border: 1px solid #a7f3d0;
}
.sprint-anchor-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #4338ca 0%, #b48e32 100%);
  border-radius: 999px;
  transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
.sprint-anchor-bar-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.78rem;
  font-weight: 700;
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  letter-spacing: 0.02em;
}
.sprint-anchor-equation {
  font-size: 0.82rem;
  color: #065f46;
  font-style: italic;
  margin-bottom: 0.5rem;
}
.sprint-anchor-cta-hint {
  font-size: 0.86rem;
  color: #064e3b;
  font-weight: 500;
  padding-top: 0.55rem;
  border-top: 1px dashed #6ee7b7;
}

/* Reduced motion: bar fill aparece estatica. */
@media (prefers-reduced-motion: reduce) {
  .sprint-anchor-bar-fill { transition: none; }
}

/* Mobile */
@media (max-width: 640px) {
  .sprint-anchor { padding: 0.9rem 1rem; }
  .sprint-anchor-progress-text { font-size: 0.98rem; }
  .sprint-anchor-bar { height: 22px; }
}

/* ============================================================
   M-PROPIA 2 (2026-05-16) — Map Diff Viewer banner.
   Tono cyan (distinto de indigo/gold) — señal de "regenerado".
   ============================================================ */
.mdt-diff-banner {
  margin: 0 0 1.2rem;
  padding: 1rem 1.1rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #ecfeff 0%, #f0f9ff 100%);
  border-left: 4px solid #0891b2;
  box-shadow: 0 2px 8px -3px rgba(8, 145, 178, 0.15);
}
.mdt-diff-banner--noop {
  background: #f8fafc;
  border-left-color: #94a3b8;
  font-size: 0.84rem;
  color: #64748b;
  font-style: italic;
  padding: 0.7rem 0.95rem;
}
.mdt-diff-banner-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #155e75;
  margin-bottom: 0.35rem;
  letter-spacing: -0.005em;
}
.mdt-diff-banner-intro {
  margin: 0 0 0.85rem;
  font-size: 0.83rem;
  color: #0e7490;
  font-style: italic;
  line-height: 1.5;
}
.mdt-diff-summary-row {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  padding: 0.55rem 0.7rem;
  margin-bottom: 0.35rem;
  border-radius: 8px;
  font-size: 0.86rem;
  line-height: 1.45;
}
.mdt-diff-row--v1 { background: #fef2f2; }
.mdt-diff-row--v2 { background: #ecfdf5; }
.mdt-diff-side-label {
  flex: 0 0 auto;
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.mdt-diff-row--v1 .mdt-diff-side-label { color: #b91c1c; }
.mdt-diff-row--v2 .mdt-diff-side-label { color: #065f46; }
.mdt-diff-side-text { color: #334155; flex: 1; }
.mdt-diff-weeks {
  margin: 0.7rem 0 0.4rem;
  font-size: 0.84rem;
  color: #155e75;
}
.mdt-diff-sd-added strong { color: #065f46; }
.mdt-diff-sd-removed strong { color: #b91c1c; }
.mdt-diff-sd-added ul, .mdt-diff-sd-removed ul {
  margin: 0.3rem 0 0.4rem;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  color: #334155;
}
.mdt-diff-full {
  margin-top: 0.7rem;
  padding-top: 0.5rem;
  border-top: 1px dashed #a5f3fc;
}
.mdt-diff-full summary {
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 600;
  color: #155e75;
}
.mdt-diff-full-list {
  margin: 0.5rem 0 0;
  padding-left: 1rem;
  list-style: none;
  font-size: 0.78rem;
  color: #475569;
}
.mdt-diff-full-list li {
  padding: 0.3rem 0;
  border-bottom: 1px dotted #cffafe;
}
.mdt-diff-full-list code {
  background: #cffafe;
  padding: 0.05rem 0.3rem;
  border-radius: 4px;
  font-size: 0.74rem;
  color: #155e75;
}
.mdt-diff-full-list em { color: #b91c1c; font-style: italic; }
.mdt-diff-full-list strong { color: #065f46; }

/* ============================================================
   M-PROPIA 5 (2026-05-16) — Persona chip (tone modulation).
   Pequeño chip arriba del Decision tab que comunica "esto fue
   calibrado a tu persona conductual".
   ============================================================ */
.mdt-persona-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.85rem;
  margin: 0 0 1rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #f5f3ff 0%, #fef3c7 100%);
  border: 1px solid #c4b5fd;
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #4c1d95;
}
.mdt-persona-chip[data-persona="urgente"] {
  background: linear-gradient(135deg, #fee2e2 0%, #fef3c7 100%);
  border-color: #fca5a5;
  color: #991b1b;
}
.mdt-persona-chip[data-persona="quemado"] {
  background: linear-gradient(135deg, #e0e7ff 0%, #f0f9ff 100%);
  border-color: #a5b4fc;
  color: #3730a3;
}
.mdt-persona-chip[data-persona="analitico"] {
  background: linear-gradient(135deg, #ecfdf5 0%, #e0f2fe 100%);
  border-color: #6ee7b7;
  color: #065f46;
}
.mdt-persona-chip[data-persona="desordenado"] {
  background: linear-gradient(135deg, #fef3c7 0%, #fef9c3 100%);
  border-color: #fde68a;
  color: #92400e;
}
.mdt-persona-chip-dot {
  font-size: 0.6rem;
  opacity: 0.6;
}

/* ======================================================================
   LAUNCH PRICE ANCHORING v2 — Entry hub + Direct checkout (2026-05-16)
   Aplica el gancho $99 tachado -> $47 + badge "PRECIO DE LANZAMIENTO"
   en las dos pantallas de entrada (entry hub y compra directa del Map).
   Tokens consistentes con .tsk-tier-price-strike / .tsk-launch-badge.
   ====================================================================== */

/* Entry hub — card del Execution Map en pantallaLogin */
.entry-option-map.entry-option-map--launch {
  position: relative;
  border: 2px solid #b48e32;
  background: linear-gradient(180deg, #fffdf6 0%, #fffbe9 100%);
  box-shadow: 0 6px 22px rgba(180, 142, 50, 0.18);
}
.entry-option-badge--launch {
  background: linear-gradient(135deg, #dc2626 0%, #b48e32 100%);
  color: #fff;
  font-weight: 800;
  letter-spacing: 0.04em;
  animation: launchPulse 2.4s ease-in-out infinite;
}
.entry-option-price-row {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  flex-wrap: wrap;
  margin: 0.4rem 0 0.2rem;
}
.entry-option-price-strike {
  color: var(--ink-mute);
  text-decoration: line-through;
  text-decoration-color: #dc2626;
  font-size: 1.05rem;
  font-weight: 600;
}
.entry-option-price.entry-option-price--launch {
  color: #b48e32;
  font-weight: 900;
  font-size: 1.55rem;
  text-shadow: 0 1px 0 rgba(180, 142, 50, 0.15);
}
.entry-option-price-save {
  background: #ecfdf5;
  color: #047857;
  font-weight: 700;
  font-size: 0.78rem;
  padding: 0.18rem 0.5rem;
  border-radius: 999px;
  border: 1px solid #a7f3d0;
  white-space: nowrap;
}
.entry-option-launch-micro {
  font-size: 0.72rem;
  color: #92400e;
  font-style: italic;
  margin: 0.2rem 0 0.5rem;
}

/* Pantalla compra directa — checkout-price-block versión launch */
.checkout-price-block.checkout-price-block--launch {
  position: relative;
  padding: 1.4rem 1.2rem;
  border: 2px solid #b48e32;
  border-radius: 14px;
  background: linear-gradient(180deg, #fffdf6 0%, #fff8e0 100%);
  box-shadow: 0 8px 26px rgba(180, 142, 50, 0.20);
  text-align: center;
}
.checkout-launch-badge {
  display: inline-block;
  background: linear-gradient(135deg, #dc2626 0%, #b48e32 100%);
  color: #fff;
  font-weight: 800;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  margin-bottom: 0.7rem;
  animation: launchPulse 2.4s ease-in-out infinite;
}
.checkout-price-row {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.8rem;
  flex-wrap: wrap;
}
.checkout-price-strike {
  color: #94a3b8;
  text-decoration: line-through;
  text-decoration-color: #dc2626;
  font-size: 1.2rem;
  font-weight: 600;
}
.checkout-price-large.checkout-price-large--launch {
  color: #b48e32;
  font-weight: 900;
  font-size: 2.6rem;
  margin: 0;
}
.checkout-price-micro {
  font-size: 0.85rem;
  color: #92400e;
  font-style: italic;
  margin: 0.7rem 0 0;
}

@keyframes launchPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.35); }
  50%      { box-shadow: 0 0 0 8px rgba(220, 38, 38, 0); }
}

/* ============================================================================
   Execution Map Premium Body (2026-06-06) — el cuerpo del deliverable pagado.
   Audit founder: el header tenia gradiente premium pero el cuerpo renderizaba
   .dp-rgd-section / .em-section PLANOS (label uppercase + texto negro). Las
   cards premium (.mdt-block--*) existian pero solo en los tabs. Este bloque
   las trae al cuerpo SOLO en contexto pagado (#postMapBody) via CSS scoping —
   cero cambios de datos; el diagnostico Free conserva su look liviano.
   ========================================================================== */

/* --- Diagnostico (dp-rgd-*) como cards --- */
#postMapBody .dp-rgd-block {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  margin-top: var(--space-2);
}
#postMapBody .dp-rgd-section {
  margin-top: 0;
  padding: 1rem 1.15rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}
#postMapBody .dp-rgd-label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.45rem;
}
#postMapBody .dp-rgd-label::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--indigo-strong, #4f46e5);
  flex: 0 0 auto;
}

/* 1) Patron operativo — card destacada indigo (espejo de .mdt-block--anchor) */
#postMapBody .dp-rgd-pattern {
  background: linear-gradient(135deg, #4f46e5 0%, #3730a3 100%);
  border-color: #3730a3;
}
#postMapBody .dp-rgd-pattern .dp-rgd-label { color: rgba(254, 243, 199, 0.9); }
#postMapBody .dp-rgd-pattern .dp-rgd-label::before { background: #fbbf24; }
#postMapBody .dp-rgd-pattern .dp-rgd-headline {
  color: #fef3c7;
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: 0.005em;
}
#postMapBody .dp-rgd-pattern .dp-rgd-body { color: #e0e7ff; }

/* 2) Percibido — card neutra con acento gris */
#postMapBody .dp-rgd-perceived { border-left: 4px solid #cbd5e1; }
#postMapBody .dp-rgd-perceived .dp-rgd-label { color: #64748b; }
#postMapBody .dp-rgd-perceived .dp-rgd-label::before { background: #94a3b8; }

/* 3) Restriccion real — ambar si diverge, teal si consuena */
#postMapBody .dp-rgd-actual[data-divergence="true"] {
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  border-color: #fb923c;
  border-left: 4px solid #f97316;
}
#postMapBody .dp-rgd-actual[data-divergence="true"] .dp-rgd-label { color: #c2410c; }
#postMapBody .dp-rgd-actual[data-divergence="true"] .dp-rgd-label::before { background: #f97316; }
#postMapBody .dp-rgd-actual[data-divergence="false"] {
  background: linear-gradient(135deg, #f0fdfa 0%, #ccfbf1 100%);
  border-color: #5eead4;
  border-left: 4px solid #14b8a6;
}
#postMapBody .dp-rgd-actual[data-divergence="false"] .dp-rgd-label { color: #0f766e; }
#postMapBody .dp-rgd-actual[data-divergence="false"] .dp-rgd-label::before { background: #14b8a6; }
#postMapBody .dp-rgd-actual .dp-rgd-body { font-weight: 600; color: #1f2937; }
#postMapBody .dp-rgd-callout {
  margin: 0.55rem 0 0;
  padding: 0.45rem 0.7rem;
  background: rgba(255, 255, 255, 0.65);
  border-radius: 8px;
  font-size: 0.85rem;
  font-style: italic;
  color: #57534e;
}

/* 4) Costo de demorar — color por banda real de urgencia */
#postMapBody .dp-rgd-cost[data-cost-band="high"] {
  background: #fef2f2;
  border-color: #fca5a5;
  border-left: 4px solid #dc2626;
}
#postMapBody .dp-rgd-cost[data-cost-band="high"] .dp-rgd-label { color: #b91c1c; }
#postMapBody .dp-rgd-cost[data-cost-band="high"] .dp-rgd-label::before { background: #dc2626; }
#postMapBody .dp-rgd-cost[data-cost-band="medium"] {
  background: #fffbeb;
  border-color: #fcd34d;
  border-left: 4px solid #f59e0b;
}
#postMapBody .dp-rgd-cost[data-cost-band="medium"] .dp-rgd-label { color: #b45309; }
#postMapBody .dp-rgd-cost[data-cost-band="medium"] .dp-rgd-label::before { background: #f59e0b; }
#postMapBody .dp-rgd-cost[data-cost-band="low"] .dp-rgd-label { color: #64748b; }
#postMapBody .dp-rgd-cost[data-cost-band="low"] .dp-rgd-label::before { background: #94a3b8; }

/* 5) Proxima jugada — verde (espejo de .mdt-block--metric) */
#postMapBody .dp-rgd-next {
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  border-color: #6ee7b7;
  border-left: 4px solid #059669;
}
#postMapBody .dp-rgd-next .dp-rgd-label { color: #047857; }
#postMapBody .dp-rgd-next .dp-rgd-label::before { background: #059669; }
#postMapBody .dp-rgd-next .dp-rgd-body { color: #064e3b; font-weight: 600; }

/* Prioridad dominante + divergencia narrativa */
#postMapBody .dp-rgd-priority {
  background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%);
  border-color: #a5b4fc;
  border-left: 4px solid #4f46e5;
}
#postMapBody .dp-rgd-priority .dp-rgd-label { color: #4338ca; }

/* --- Secciones del payload (.em-section) como bloques con fondo --- */
#postMapBody .em-section {
  margin-top: 1.1rem;
  padding: 1rem 1.15rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-top: 3px solid rgba(99, 102, 241, 0.5);
  border-radius: 12px;
}
#postMapBody .em-section--stop { border-top-color: #f59e0b; background: #fffdf7; }
#postMapBody .em-section--rec { border-top-color: #10b981; background: #f6fefb; }
#postMapBody .em-section-title { font-size: 1.05rem; }

/* Semanas como mini-cards numeradas con badge */
#postMapBody .em-week-list {
  list-style: none;
  padding-left: 0;
  counter-reset: emweek;
}
#postMapBody .em-week {
  counter-increment: emweek;
  position: relative;
  margin: 0.7rem 0;
  padding: 0.8rem 1rem 0.8rem 3rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-left: 3px solid rgba(99, 102, 241, 0.55);
  border-radius: 10px;
}
#postMapBody .em-week::before {
  content: counter(emweek);
  position: absolute;
  left: 0.85rem;
  top: 0.85rem;
  width: 1.6rem;
  height: 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #4f46e5, #3730a3);
  color: #fef3c7;
  font-weight: 800;
  font-size: 0.85rem;
  border-radius: 50%;
}

@media (max-width: 640px) {
  #postMapBody .dp-rgd-section,
  #postMapBody .em-section { padding: 0.85rem 0.9rem; }
  #postMapBody .em-week { padding-left: 2.6rem; }
}

/* === Revenue GPS hero (trayectoria a la meta) === */
.revenue-gps-hero {
  margin: 0 0 14px 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  border: 1px solid rgba(148, 163, 184, 0.18);
  color: #e2e8f0;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.22);
}
.revenue-gps-hero.rgps-ontrack { border-left: 4px solid #22c55e; }
.revenue-gps-hero.rgps-risk { border-left: 4px solid #f59e0b; }
.revenue-gps-hero .rgps-head {
  font-size: 0.74rem; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: #94a3b8; margin-bottom: 8px;
}
.revenue-gps-hero .rgps-bar {
  height: 7px; border-radius: 99px; background: rgba(148, 163, 184, 0.20);
  overflow: hidden; margin: 6px 0 10px 0;
}
.revenue-gps-hero .rgps-bar-fill {
  height: 100%; border-radius: 99px;
  background: linear-gradient(90deg, #38bdf8, #22c55e);
  transition: width 0.5s ease;
}
.revenue-gps-hero .rgps-line { font-size: 0.92rem; line-height: 1.45; margin: 2px 0; }
.revenue-gps-hero .rgps-line-main { font-size: 1.06rem; font-weight: 600; color: #f8fafc; }
.revenue-gps-hero .rgps-lever {
  margin-top: 8px; padding-top: 8px; font-size: 0.9rem; color: #fcd34d;
  border-top: 1px solid rgba(148, 163, 184, 0.15);
}

/* ============================================================
   EL-10 (auditoría 2026-06-11) — Tema Momentum 90 cohesivo.
   Antes el .tier-momentum solo doraba badges/bordes sueltos y el
   dashboard de $1500 se veía casi igual al de Sprint. Acá llevamos
   el acento gold/indigo a las superficies estructurales: tabs
   activas, botones primarios y barras de progreso.
   ============================================================ */
.tier-momentum .dash-tab.active {
  color: var(--gold-strong);
  background: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%);
  box-shadow: 0 4px 16px -4px rgba(245, 158, 11, 0.30),
              0 1px 3px rgba(79, 70, 229, 0.10);
}
.tier-momentum .dash-tab:hover {
  color: var(--gold-strong);
  background: var(--gold-soft);
}
.tier-momentum .btn-primario {
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-strong) 100%);
  border-color: var(--gold-strong);
  box-shadow: 0 6px 18px -6px rgba(245, 158, 11, 0.45),
              0 2px 6px rgba(79, 70, 229, 0.12);
}
.tier-momentum .btn-primario:hover {
  background: linear-gradient(135deg, var(--gold-strong) 0%, #b45309 100%);
}
/* Barras de progreso genéricas → gradiente indigo→gold (premium). */
.tier-momentum .ev-progress-fill,
.tier-momentum .journey-bar-fill,
.tier-momentum .progress-fill {
  background: linear-gradient(90deg, var(--indigo) 0%, var(--gold) 100%);
}
/* Headers de sección con acento dorado sutil. */
.tier-momentum .ev-dim-header,
.tier-momentum .econ-dash-header {
  border-left: 3px solid var(--gold);
}

/* ============================================================
   EL-16 (auditoría 2026-06-11) — Card "Launch Price" del Map.
   Antes usaba rojo→marrón con badge pulsante (señal de flash-sale
   barata) y se veía menos premium que la card M90. La realineamos
   a la paleta de marca (indigo/teal) y quitamos la urgencia
   artificial del pulso.
   ============================================================ */
.entry-option-map.entry-option-map--launch {
  border: 2px solid var(--indigo);
  background: linear-gradient(180deg, #ffffff 0%, #f5f4ff 100%);
  box-shadow: 0 12px 32px -10px rgba(79, 70, 229, 0.28),
              0 4px 12px -4px rgba(20, 184, 166, 0.16);
}
.entry-option-badge--launch {
  background: linear-gradient(135deg, var(--indigo) 0%, var(--indigo-strong) 100%);
  animation: none; /* EL-16: sin pulso de urgencia artificial */
}
.entry-option-price.entry-option-price--launch {
  color: var(--indigo-strong);
}

/* ════════════════════════════════════════════════════════════════════
   Overlay scroll-safety (2026-06-12) — fix de CLASE, no de instancia.
   Defecto congelado: overlays position:fixed con flex centrado y SIN
   overflow cortaban el contenido cuando la card crecía más que el
   viewport — el CTA quedaba inalcanzable y la pantalla parecía colgada
   (bug founder 2026-06-12: Day-1 welcome con bloques Sprint30 extendidos
   dejaba "Ver mi plan" fuera de pantalla).
   Patrón: el overlay scrollea (overflow-y) + align-items:flex-start, y
   la card recupera el centrado vertical con margin auto SOLO cuando el
   contenido entra en el viewport. Comportamiento visual idéntico al
   anterior para contenido corto; scrolleable para contenido largo.
   (.modal-overlay y .wr-card ya eran seguros vía max-height en la card.)
   ════════════════════════════════════════════════════════════════════ */
.day1-welcome-overlay,
.onboarding-overlay,
.goal-achieved-overlay,
.pq-overlay,
.modal,
.rj-modal-overlay,
.phase-celebration-overlay,
.achievement-fullscreen-overlay,
.mc-rankup-overlay,
.pattern-broken-celebration {
  overflow-y: auto;
  align-items: flex-start;
}
.d1w-card,
.onboarding-premium-card,
.goal-achieved-card,
.pq-card,
.modal .modal-content,
.rj-modal,
.phase-celebration-content,
.achievement-fullscreen-content,
.mc-rankup-content,
.pattern-broken-card {
  margin-top: auto;
  margin-bottom: auto;
}
