/* Portal de clientes de DabyChos (dabychos.com/app). Identidad de la marca: fondo #0b0e14, tarjeta #131826, borde #232b3d,
   texto #e8edf6 / #9aa7bd, cian #22d3ee, rosa #f472b6, ámbar #fbbf24; Space Grotesk para títulos e Inter para el texto,
   servidas desde aquí (CSP font-src 'self'). Oscuro por omisión; con el teléfono en modo claro, una versión clara derivada
   con contraste de 4.5:1 o más en todo el texto (lo revisa test_43). Sin estilos en línea: la CSP no los deja.
   Pensado primero para un teléfono de 360–390 px. */
@font-face{font-family:"Inter";src:url(fuentes/inter.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"Space Grotesk";src:url(fuentes/space-grotesk.woff2) format("woff2");font-weight:500 700;font-display:swap}

:root{
  --bg:#0b0e14; --card:#131826; --card-2:#1a2133; --borde:#232b3d; --borde-2:#2f3a52;
  --texto:#e8edf6; --suave:#9aa7bd; --tenue:#8792a8;
  --acento:#22d3ee; --acento-texto:#06222a; --acento-suave:rgba(34,211,238,.12); --acento-borde:rgba(34,211,238,.45);
  --rosa:#f472b6; --rosa-suave:rgba(244,114,182,.13); --ambar:#fbbf24; --ambar-suave:rgba(251,191,36,.13);
  --ok:#34d399; --ok-suave:rgba(52,211,153,.13); --mal:#fb7185; --mal-suave:rgba(251,113,133,.13);
  --sombra:0 18px 40px -22px rgba(0,0,0,.85); --barra:rgba(11,14,20,.78);
  --brillo-1:rgba(34,211,238,.10); --brillo-2:rgba(244,114,182,.07);
  --titulo:"Space Grotesk","Inter",system-ui,sans-serif; --cuerpo:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --dato:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --r:16px; --r-chico:12px; color-scheme:dark;
  /* nombres de la sesión 1–4 (las plantillas de admin los usan) */
  --papel:var(--bg); --hoja:var(--card); --hoja-2:var(--card-2); --tinta:var(--texto); --tinta-2:var(--suave); --tinta-3:var(--tenue);
  --linea:var(--borde); --plano:var(--acento); --plano-suave:var(--acento-suave); --naranja:var(--rosa); --naranja-suave:var(--rosa-suave);
  --aviso:var(--ambar); --aviso-suave:var(--ambar-suave);
}
@media (prefers-color-scheme: light){:root{
  --bg:#f5f7fb; --card:#ffffff; --card-2:#eef2f8; --borde:#d9e0ec; --borde-2:#c3cddd;
  --texto:#0b1220; --suave:#475569; --tenue:#556074;
  --acento:#0e7490; --acento-texto:#ffffff; --acento-suave:#e0f2f6; --acento-borde:rgba(14,116,144,.45);
  --rosa:#be185d; --rosa-suave:#fde7f1; --ambar:#92400e; --ambar-suave:#fdf2d8;
  --ok:#047857; --ok-suave:#ddf5ea; --mal:#be123c; --mal-suave:#fde6ea;
  --sombra:0 14px 34px -24px rgba(15,23,42,.45); --barra:rgba(245,247,251,.85);
  --brillo-1:rgba(34,211,238,.13); --brillo-2:rgba(244,114,182,.09); color-scheme:light}}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--texto);font:16px/1.6 var(--cuerpo);-webkit-font-smoothing:antialiased;
  background-image:radial-gradient(ellipse 80% 50% at 0% -8%,var(--brillo-1),transparent 62%),radial-gradient(ellipse 55% 40% at 105% 8%,var(--brillo-2),transparent 60%);
  background-attachment:fixed;background-repeat:no-repeat;padding-bottom:48px}
a{color:var(--acento);text-underline-offset:3px;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--rosa);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--titulo);line-height:1.12;margin:0;text-wrap:balance;font-weight:700;letter-spacing:-.02em}
h1{font-size:clamp(30px,8vw,46px)} h2{font-size:clamp(21px,5.2vw,27px)} h3,.h3{font-size:19px;letter-spacing:-.01em}
p{margin:0}
small{font-size:13.5px}
.tenue{color:var(--suave)}
.dato{font-family:var(--dato);font-size:.84em;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.sin-marco{border:0;padding:0;margin:0;min-width:0}

/* ── barra y navegación ───────────────────────────────────────────────────────────────────────────────────────────── */
.barra{position:sticky;top:0;z-index:30;background:var(--barra);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);
  border-bottom:1px solid var(--borde);padding-top:env(safe-area-inset-top)}
.barra-fila{max-width:980px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px}
.marca{display:inline-flex;align-items:center;gap:9px;font-family:var(--titulo);font-weight:700;font-size:19px;color:var(--texto);text-decoration:none;letter-spacing:-.02em}
.marca i{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#22d3ee,#f472b6);display:grid;place-items:center;
  font-style:normal;color:#0b0e14;font-size:16px;box-shadow:0 6px 20px -6px rgba(34,211,238,.6);flex:none}
.marca-sub{font-family:var(--cuerpo);font-weight:500;font-size:13px;color:var(--suave);padding:2px 9px;border:1px solid var(--borde);border-radius:999px;margin-left:2px}
.marca-sola{justify-content:center;margin-bottom:6px}
.marca-pie{font-size:14px}.marca-pie i{width:20px;height:20px;border-radius:6px;font-size:11px;box-shadow:none}
.quien{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--suave);min-width:0}
.quien img,.quien .avatar{width:30px;height:30px;border-radius:50%;flex:none}
.quien .avatar{display:grid;place-items:center;background:var(--card-2);border:1px solid var(--borde);color:var(--texto);font-weight:600;font-size:13px}
.quien-nombre{max-width:34vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:420px){.quien-nombre{display:none}}
[id]{scroll-margin-top:130px}
.salir{background:none;border:1px solid var(--borde);color:var(--suave);font:inherit;font-size:13px;cursor:pointer;padding:5px 11px;border-radius:999px;min-height:32px}
.salir:hover{color:var(--texto);border-color:var(--borde-2)}
.nav{max-width:980px;margin:0 auto;display:flex;gap:6px;padding:0 16px 10px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;font-size:14.5px}
.nav::-webkit-scrollbar{display:none}
.nav a{flex:none;text-decoration:none;color:var(--suave);padding:7px 13px;border-radius:999px;border:1px solid transparent;white-space:nowrap;font-weight:500;min-height:36px;display:inline-flex;align-items:center}
.nav a:hover{color:var(--texto);background:var(--card-2)}
.nav a[aria-current="page"]{color:var(--texto);background:var(--card);border-color:var(--borde-2);box-shadow:inset 0 -2px 0 var(--acento)}
.nav-admin{padding-bottom:6px}
.nav-admin+.nav-proyecto{border-top:1px dashed var(--borde);padding-top:8px}

/* ── estructura ───────────────────────────────────────────────────────────────────────────────────────────────────── */
main{max-width:980px;margin:0 auto;display:grid;gap:26px;padding:22px 16px 0}
.cab{display:grid;gap:8px}
.ceja{font-family:var(--dato);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--acento);font-weight:500}
section{display:grid;gap:12px;min-width:0}
.tarjeta{background:var(--card);border:1px solid var(--borde);border-radius:var(--r);padding:16px 18px;display:grid;gap:10px;min-width:0;box-shadow:var(--sombra)}
a.tarjeta{text-decoration:none;color:inherit}
.lista{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.fila{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 12px}
.fila .titulo,.titulo{font-weight:600;min-width:0;overflow-wrap:anywhere}
.vacio{background:transparent;border:1px dashed var(--borde-2);border-radius:var(--r);padding:16px 18px;color:var(--suave);display:grid;gap:10px}
.contador{font-family:var(--titulo);font-size:30px;line-height:1;font-variant-numeric:tabular-nums;font-weight:700}
.rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px;align-items:start}
.rejilla-chica{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
footer{max-width:980px;margin:44px auto 0;padding:14px 16px 0;border-top:1px solid var(--borde);font-size:13px;color:var(--suave);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
footer a{color:var(--suave)}

/* ── chips ────────────────────────────────────────────────────────────────────────────────────────────────────────── */
.chip{display:inline-flex;align-items:center;gap:5px;font:600 11.5px/1 var(--cuerpo);letter-spacing:.03em;padding:6px 10px;border-radius:999px;white-space:nowrap;
  background:var(--card-2);color:var(--suave);border:1px solid var(--borde)}
.chip.abierta,.chip.pendiente,.chip.borrador,.chip.lista_para_probar{background:var(--ambar-suave);color:var(--ambar);border-color:transparent}
.chip.respondida,.chip.aprobada,.chip.en_tiempo,.chip.decide,.chip.aceptada{background:var(--ok-suave);color:var(--ok);border-color:transparent}
.chip.cerrada,.chip.ve,.chip.planeada,.chip.reemplazada{background:var(--card-2);color:var(--suave)}
.chip.en_riesgo,.chip.con_ajustes{background:var(--rosa-suave);color:var(--rosa);border-color:transparent}
.chip.desviado{background:var(--mal-suave);color:var(--mal);border-color:transparent}
.chip.recomendada,.chip.en_curso{background:var(--acento-suave);color:var(--acento);border-color:transparent}
.chip.estrella{background:var(--ambar-suave);color:var(--ambar);border-color:transparent}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip.impacto-alto{background:var(--ok-suave);color:var(--ok);border-color:transparent}
.chip.impacto-medio{background:var(--acento-suave);color:var(--acento);border-color:transparent}
.chip.esfuerzo-grande{background:var(--rosa-suave);color:var(--rosa);border-color:transparent}

.turno{border-left:3px solid var(--rosa)}
.turno.cliente{border-left-color:var(--acento)}

/* ── botones y formularios ───────────────────────────────────────────────────────────────────────────────────────── */
.btn,.boton{font:600 15px/1.2 var(--cuerpo);border-radius:var(--r-chico);border:1px solid var(--borde-2);background:var(--card-2);color:var(--texto);
  padding:11px 16px;cursor:pointer;min-height:44px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-align:center}
.btn:hover{border-color:var(--acento-borde)}
.btn.primario,.boton{background:var(--acento);color:var(--acento-texto);border-color:var(--acento);box-shadow:0 10px 26px -14px rgba(34,211,238,.9)}
.btn.primario:hover,.boton:hover{filter:brightness(1.08)}
.btn.peligro{background:transparent;color:var(--mal);border-color:var(--mal)}
.btn.chico{min-height:36px;padding:7px 12px;font-size:14px}
.btn.grande{min-height:54px;padding:15px 20px;font-size:16.5px;width:100%;max-width:520px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.acciones{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
form.enlinea{display:inline}
.campo{display:grid;gap:6px}
.campo label,label.sin-marco{font-weight:600;font-size:14.5px}
input[type=text],input[type=email],input[type=url],input[type=date],input[type=time],select,textarea{font:16px/1.4 var(--cuerpo);color:var(--texto);
  background:var(--card-2);border:1px solid var(--borde-2);border-radius:var(--r-chico);padding:11px 12px;width:100%;min-width:0}
input:focus,select:focus,textarea:focus{outline:2px solid var(--acento-borde);outline-offset:0;border-color:var(--acento)}
textarea{min-height:5rem;resize:vertical}
::placeholder{color:var(--tenue);opacity:1}
.opciones{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.opciones label{display:flex;gap:12px;align-items:flex-start;background:var(--card-2);border:1px solid var(--borde);border-radius:var(--r-chico);padding:12px 14px;cursor:pointer}
/* Controles propios (los del sistema se ven grises en modo oscuro): círculo para «elige una», cuadro para «varias». */
.opciones input,.predeterminada input{-webkit-appearance:none;appearance:none;margin:2px 0 0;width:22px;height:22px;flex:none;border:2px solid var(--borde-2);
  border-radius:50%;background:var(--card);display:grid;place-items:center;cursor:pointer}
.opciones input[type=checkbox]{border-radius:7px}
.opciones input::after,.predeterminada input::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--acento);transform:scale(0)}
.opciones input[type=checkbox]::after{width:12px;height:12px;border-radius:0;clip-path:polygon(14% 44%,0 62%,40% 100%,100% 22%,84% 6%,38% 66%)}
.opciones input:checked,.predeterminada input:checked{border-color:var(--acento)}
.opciones input[type=checkbox]:checked{background:var(--acento)}
.opciones input[type=checkbox]:checked::after{background:var(--acento-texto)}
.opciones input:checked::after,.predeterminada input:checked::after{transform:scale(1)}
.opciones input:focus-visible{outline:2px solid var(--rosa);outline-offset:2px}
@media (prefers-reduced-motion:no-preference){.opciones input::after{transition:transform .12s}}
.opciones label:has(input:checked){border-color:var(--acento);background:var(--acento-suave)}

.aviso{background:var(--ok-suave);border:1px solid var(--ok);border-radius:var(--r-chico);padding:12px 14px;color:var(--texto)}
.aviso.mal{background:var(--mal-suave);border-color:var(--mal)}
.toast{font-size:14px;color:var(--ok)}
.nota{border-left:3px solid var(--acento);background:var(--acento-suave);padding:9px 13px;border-radius:0 var(--r-chico) var(--r-chico) 0}

.tabla{overflow-x:auto;border:1px solid var(--borde);border-radius:var(--r);background:var(--card)}
table{border-collapse:collapse;width:100%;font-size:14.5px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--borde);vertical-align:top}
th{font-family:var(--dato);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--suave);font-weight:500;white-space:nowrap}
tr:last-child td{border-bottom:0}

.aviso-pagina{min-height:58vh;display:grid;place-items:center}
.aviso-pagina .tarjeta{max-width:32rem;text-align:center;justify-items:center;padding:28px 22px;gap:14px}
.aviso-pagina form.campo{width:100%;text-align:left}
.texto-semana{display:grid;gap:10px;overflow-wrap:anywhere}.texto-semana ul,.texto-semana ol{margin:0;padding-left:1.3rem;display:grid;gap:4px}
.texto-semana h2,.texto-semana h3,.texto-semana h4{margin-top:6px}
@media (prefers-reduced-motion:no-preference){.btn,.nav a,.opciones label{transition:background-color .15s,border-color .15s,filter .15s}}

/* ── expediente (sesión 3) ───────────────────────────────────────────────────────────────────────────────────────── */
progress{display:block;width:100%;height:10px;-webkit-appearance:none;appearance:none;border:0;border-radius:999px;background:var(--card-2);overflow:hidden;color:var(--acento)}
progress::-webkit-progress-bar{background:var(--card-2);border-radius:999px}
progress::-webkit-progress-value{background:linear-gradient(90deg,#22d3ee,#f472b6);border-radius:999px}
progress::-moz-progress-bar{background:linear-gradient(90deg,#22d3ee,#f472b6);border-radius:999px}
details{display:grid;gap:8px}
summary{cursor:pointer;padding-block:6px;overflow-wrap:anywhere}
code{font-family:var(--dato);font-size:.88em;background:var(--card-2);border:1px solid var(--borde);padding:1px 5px;border-radius:6px;overflow-wrap:anywhere}
pre{margin:0;background:var(--card-2);border:1px solid var(--borde);border-radius:var(--r-chico);padding:10px 12px;overflow-x:auto;font-size:14px}
pre code{background:none;border:0;padding:0;overflow-wrap:normal}
.tutorial ol>li{padding-left:2px}
.tutorial figure{margin:10px 0 4px;display:grid;gap:6px;justify-items:start}
.tutorial img{display:block;max-width:min(100%,360px);height:auto;border:1px solid var(--borde);border-radius:var(--r-chico)}
.tutorial figcaption{font-size:13px;color:var(--suave)}

/* ── demos (sesión 4) ─────────────────────────────────────────────────────────────────────────────────────────────── */
.demo{display:grid;gap:6px;min-width:0}
.demo-marco{display:block;width:100%;height:calc(100dvh - 150px);min-height:460px;max-height:920px;border:1px solid var(--borde-2);border-radius:var(--r);background:#fff}
.sugerir{position:fixed;right:16px;bottom:16px;z-index:20;display:grid;justify-items:end;gap:8px;text-align:right;width:min(calc(100vw - 32px),380px);pointer-events:none}
.sugerir>*{pointer-events:auto}
.sugerir>summary{list-style:none;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.sugerir>summary::-webkit-details-marker{display:none}
.sugerir[open]>summary{background:var(--card);color:var(--acento)}
.sugerir form{width:100%;text-align:left;margin-top:8px;box-shadow:0 14px 34px rgba(0,0,0,.4)}
main:has(.sugerir){padding-bottom:72px}

/* ── el embudo del portal ─────────────────────────────────────────────────────────────────────────────────────────── */
.heroe-portal{display:grid;gap:12px;padding:6px 0 2px}
.heroe-portal h1{font-size:clamp(32px,9vw,52px)}
.estado{display:inline-flex;align-items:center;gap:9px;justify-self:start;padding:7px 14px;border-radius:999px;background:var(--card);border:1px solid var(--borde-2);font-weight:600;font-size:14.5px}
.estado .punto{width:9px;height:9px;border-radius:50%;background:var(--ambar);box-shadow:0 0 0 0 rgba(251,191,36,.5)}
.estado-cita_confirmada .punto,.estado-demo .punto,.estado-proyecto .punto{background:var(--ok)}
.estado-cuestionario .punto{background:var(--acento)}
@media (prefers-reduced-motion:no-preference){.estado .punto{animation:latido 2.2s infinite}}
@keyframes latido{70%{box-shadow:0 0 0 9px rgba(251,191,36,0)}100%{box-shadow:0 0 0 0 rgba(251,191,36,0)}}
.pasos-embudo,.pasos{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;counter-reset:paso}
.pasos{grid-template-columns:repeat(4,minmax(0,1fr))}
.pasos-embudo li,.pasos li{display:grid;justify-items:center;gap:6px;text-align:center;font-size:12px;line-height:1.25;color:var(--tenue);position:relative;min-width:0}
.pasos-embudo li::before,.pasos li::before{content:"";position:absolute;top:15px;left:calc(-50% + 18px);right:calc(50% + 18px);height:2px;background:var(--borde-2)}
.pasos-embudo li:first-child::before,.pasos li:first-child::before{display:none}
.pasos-embudo li.hecho::before,.pasos-embudo li.actual::before,.pasos li.hecho::before,.pasos li.actual::before{background:linear-gradient(90deg,#22d3ee,#f472b6)}
.bola{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--card);border:1px solid var(--borde-2);font-weight:700;font-size:13.5px;color:var(--suave);position:relative;z-index:1}
.hecho .bola{background:var(--acento-suave);border-color:var(--acento-borde);color:var(--acento)}
.actual .bola{background:linear-gradient(135deg,#22d3ee,#f472b6);border-color:transparent;color:#0b0e14;box-shadow:0 8px 22px -8px rgba(34,211,238,.8)}
.actual,.hecho{color:var(--texto)}
.pasos a{display:grid;justify-items:center;gap:6px;text-decoration:none;color:inherit;min-width:0}
.paso-nombre{overflow-wrap:anywhere}

.cta-cuestionario,.cta-demo{position:relative;border:1px solid transparent;background:linear-gradient(var(--card),var(--card)) padding-box,
  linear-gradient(135deg,rgba(34,211,238,.75),rgba(244,114,182,.75)) border-box;padding:20px 18px;gap:12px}
.cta-cuestionario h2,.cta-demo h2{font-size:clamp(22px,6vw,30px)}
.nota-48{background:var(--ambar-suave);border:1px solid rgba(251,191,36,.35);border-radius:var(--r-chico);padding:12px 14px;display:grid;gap:6px;color:var(--texto)}
.nota-48 strong{color:var(--ambar)}
.cuenta{font-variant-numeric:tabular-nums}
.cuenta-grande{font-family:var(--titulo);font-size:clamp(34px,10vw,52px);font-weight:700;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  background:linear-gradient(90deg,#22d3ee,#f472b6);-webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-color-scheme: light){.cuenta-grande{background:none;color:var(--acento)}}
.fecha-grande{font-family:var(--titulo);font-size:clamp(22px,6vw,30px);font-weight:700;line-height:1.15}
.cita .fecha-cita{font-family:var(--titulo);font-size:20px;letter-spacing:-.01em}
.cita-confirmada{border-color:rgba(52,211,153,.4)}
.enlace-sala{overflow-wrap:anywhere}
form.cancelar{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;border-top:1px dashed var(--borde);padding-top:12px;margin-top:2px}
.linea{list-style:none;margin:0;padding:0 0 0 18px;display:grid;gap:14px;position:relative}
.linea::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--borde-2);border-radius:2px}
.linea li{display:grid;gap:2px;position:relative}
.linea li::before{content:"";position:absolute;left:-18px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--card);border:2px solid var(--acento)}
.linea li:first-child::before{background:var(--acento)}
.linea-texto{overflow-wrap:anywhere}
.respuestas{margin:0;gap:0;padding:6px 18px}
.respuestas>div{display:grid;gap:4px;padding:12px 0;border-bottom:1px solid var(--borde)}
.respuestas>div:last-child{border-bottom:0}
.respuestas dt{color:var(--suave);font-size:14px}
.respuestas dd{margin:0;display:flex;flex-wrap:wrap;gap:6px}
.respuesta{background:var(--acento-suave);color:var(--texto);border-radius:10px;padding:5px 10px;font-size:14.5px}
.respuesta.otra{background:var(--rosa-suave)}
.archivo-subido{display:inline-flex;gap:6px;align-items:center;background:var(--card-2);border:1px solid var(--borde);border-radius:10px;padding:5px 10px;font-size:14px;overflow-wrap:anywhere}
.tips{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:tip}
.tips li{counter-increment:tip;padding-left:56px;position:relative}
.tips li::before{content:counter(tip);position:absolute;left:16px;top:16px;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;
  background:linear-gradient(135deg,#22d3ee,#f472b6);color:#0b0e14;font-weight:700;font-family:var(--titulo)}
.ejemplos{list-style:none;margin:0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.ejemplo a.titulo{font-family:var(--titulo);font-size:19px;text-decoration:none}

/* ── el cuestionario ──────────────────────────────────────────────────────────────────────────────────────────────── */
.intro{max-width:62ch}
.progreso-cuestionario{display:grid;gap:10px;background:var(--card);border:1px solid var(--borde);border-radius:var(--r);padding:14px 16px}
form.cuestionario{display:grid;gap:16px}
.paso-desc{margin-top:-4px}
.pregunta{border:1px solid var(--borde);border-radius:var(--r);background:var(--card);padding:16px 16px 12px;margin:0;display:grid;gap:10px;min-width:0;box-shadow:var(--sombra)}
.pregunta legend{float:left;width:100%;padding:0;font-family:var(--titulo);font-weight:700;font-size:19px;line-height:1.25;letter-spacing:-.01em;display:flex;gap:10px;align-items:flex-start}
.pregunta legend+*{clear:both}
.pregunta .num{flex:none;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-size:14px;background:var(--acento-suave);color:var(--acento);margin-top:-1px}
.ayuda{color:var(--suave);font-size:14.5px}
.tipo-respuesta{font-size:11.5px;text-transform:uppercase;letter-spacing:.08em}
.opcion-cuerpo{display:grid;gap:5px;min-width:0}
.opcion-texto{overflow-wrap:anywhere}
.opciones label.recomendada{border-color:rgba(251,191,36,.45)}
.opciones label.recomendada:has(input:checked){border-color:var(--acento)}
.opcion-cuerpo .chip{justify-self:start}
.por-que{color:var(--suave);line-height:1.45}
.otra-respuesta{display:grid;gap:8px}
.otra-respuesta textarea{min-height:3.4rem}
.subir{display:grid;gap:8px;justify-items:start}
.subir .archivo{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.subir:focus-within label.btn{outline:2px solid var(--rosa);outline-offset:3px}
.archivos{list-style:none;margin:0;padding:0;display:grid;gap:6px;width:100%}
.archivos li{display:flex;justify-content:space-between;gap:10px;align-items:center;background:var(--card-2);border:1px solid var(--borde);border-radius:10px;padding:7px 10px;font-size:14px;overflow-wrap:anywhere}
.archivos li>span{display:flex;align-items:center;gap:10px;min-width:0}
.miniatura{width:44px;height:44px;border-radius:8px;object-fit:cover;background:var(--card);border:1px solid var(--borde);flex:none}
.archivo-subido .miniatura{width:32px;height:32px}
.quitar{display:inline-flex;gap:6px;align-items:center;color:var(--suave);font-size:13px;flex:none}
.guardado{min-height:1.2em;color:var(--ok)}
.guardado.mal{color:var(--mal)}
/* Sin barra fija: en iPhone, con el teclado abierto, una barra pegada abajo brinca y tapa el campo. */
.acciones-pasos{display:flex;justify-content:space-between;gap:10px;padding:4px 0 0}
.acciones-pasos .btn{min-width:42%}
.enviar{gap:12px}
.faltan{margin:0;padding-left:1.2rem;color:var(--suave);display:grid;gap:4px}

/* ── mejoras ──────────────────────────────────────────────────────────────────────────────────────────────────────── */
.mejoras{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.mejora{gap:10px}
.eleccion{display:flex;flex-wrap:wrap;gap:8px}
.eleccion .btn[aria-pressed="true"]{background:var(--acento);color:var(--acento-texto);border-color:var(--acento)}
.eleccion .eleccion-no[aria-pressed="true"]{background:var(--card-2);color:var(--texto);border-color:var(--borde-2);text-decoration:line-through}
.mejora.elegida-me_interesa{border-color:var(--acento-borde)}
.mejora.elegida-no{opacity:.75}

/* ── paneles de David ─────────────────────────────────────────────────────────────────────────────────────────────── */
.resumen-embudo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:10px}
.destacado{display:flex;align-items:center;gap:12px}
.destacado .contador{color:var(--acento)}
.idea{border-left:3px solid var(--borde-2);padding-left:10px;color:var(--texto)}
.confirmar{border-top:1px dashed var(--borde);padding-top:12px}
.rechazar summary{color:var(--mal);font-weight:600}
.salas-rapidas{display:flex;flex-wrap:wrap;gap:8px}
.salas-rapidas .btn[aria-pressed="true"]{border-color:var(--acento);background:var(--acento-suave);color:var(--texto)}
.salas{display:grid;gap:12px}
.sala{display:grid;gap:8px;background:var(--card-2);border:1px solid var(--borde);border-radius:var(--r-chico);padding:14px}
.sala:has(input[type=radio]:checked){border-color:var(--acento)}
.sala-cabeza{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.sala-cabeza .titulo{font-family:var(--titulo);font-size:18px}
.predeterminada{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--suave);cursor:pointer}
.predeterminada input{margin:0}
.ventanas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:10px}
.semana-libre{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,130px),1fr));gap:8px}
.semana-libre .dia{padding:12px;gap:4px;box-shadow:none}
.prospecto .etapa{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.prospecto .que{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-weight:600}
.chip.largo,.prospecto .que .chip{white-space:normal;line-height:1.35;text-align:left;border-radius:12px;padding:7px 11px}
.quitar input{accent-color:var(--acento);width:18px;height:18px}
.limite{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:baseline}
.conteo-etapas{display:flex;flex-wrap:wrap;gap:6px}
.conteo-etapas a{text-decoration:none}
.ventanas{grid-template-columns:1fr}
.ventanas .campo{grid-template-columns:96px 1fr;align-items:center;gap:10px}
.prospecto .etapa select{width:auto;min-height:36px;padding:6px 10px;font-size:14px}

/* ── biblioteca del proyecto (plan BI) ───────────────────────────────────────────────────────────────────────────── */
.migas{display:flex;flex-wrap:wrap;gap:4px 7px;align-items:baseline;font-size:14px;color:var(--suave);overflow-wrap:anywhere}
.migas a{color:var(--acento)}
.bib-nombre{overflow-wrap:anywhere}
.bib-enlace{display:inline-flex;gap:10px;align-items:baseline;min-width:0;overflow-wrap:anywhere;color:var(--texto)}
.bib-tipo{flex:none;font:600 10.5px/1 var(--dato);letter-spacing:.06em;text-transform:uppercase;padding:5px 7px;border-radius:7px;
  background:var(--card-2);color:var(--suave);border:1px solid var(--borde)}
.bib-tipo.carpeta{color:var(--acento);border-color:var(--acento-borde);background:var(--acento-suave)}
.bib-tipo.video,.bib-tipo.audio{color:var(--rosa);background:var(--rosa-suave);border-color:transparent}
.bib-tipo.html,.bib-tipo.md{color:var(--ok);background:var(--ok-suave);border-color:transparent}
.bib-tipo.imagen,.bib-tipo.pdf{color:var(--ambar);background:var(--ambar-suave);border-color:transparent}
.bib-aviso{color:var(--ambar);font-size:14px}
.bib-carpeta-acciones{display:grid;gap:8px}
.bib-estado{justify-content:flex-start;align-items:center}
.bib-visor{display:grid;gap:8px;min-width:0}
.bib-video{display:block;width:100%;max-height:78vh;border-radius:var(--r);border:1px solid var(--borde);background:#000}
.bib-imagen{display:block;max-width:100%;height:auto;border-radius:var(--r);border:1px solid var(--borde);background:var(--card)}
.bib-audio{width:100%}
.bib-texto{max-height:70vh;white-space:pre-wrap;overflow-wrap:anywhere}
.bib-md img{max-width:100%}
.bib-md .tabla{margin:4px 0}
hr{border:0;border-top:1px solid var(--borde);margin:6px 0;width:100%}