/* Monte Santo · app de servicios, certificados y tablero. Estilos del prototipo aprobado (Certificados/diseno/prototipo/app.html),
   con las tipografías servidas desde la app (subconjunto latino, OFL) para que abra sin señal. */
@font-face{font-family:"Inter";src:url("/fonts/Inter-Regular.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("/fonts/Inter-Medium.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("/fonts/Inter-SemiBold.woff") format("woff");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url("/fonts/CormorantGaramond-Medium.woff") format("woff");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url("/fonts/CormorantGaramond-SemiBold.woff") format("woff");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url("/fonts/CormorantGaramond-MediumItalic.woff") format("woff");font-weight:500;font-style:italic;font-display:swap}

/* Concepto: la herramienta del recolector sobre el marfil del certificado. Una columna de 440 px que se usa con una mano;
   el tablero se abre a dos columnas en la computadora. Siempre en claro (regla de la cuenta). */
:root{
  --fondo:#F6F0ED; --superficie:#FCFAF8; --hundido:#EEE7E0; --linea:#E3D9CF; --linea-fuerte:#CBBDAF; --borde-control:#948676;
  --tinta:#3F3D3A; --tinta-2:#5F5A55; --tinta-3:#6E6862;
  --olivo:#585E49; --olivo-oscuro:#474C3A; --sobre-olivo:#F8F4F1; --olivo-suave:#E7E8DF;
  --arena:#CAA783; --arena-suave:#F2E7DA;
  --bien:#4E6B47; --bien-suave:#E3EADF; --aviso:#875811; --aviso-suave:#F5E7CC; --error:#9E3D33; --error-suave:#F6DEDA;
  --display:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --ui:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --r:12px; --r-boton:14px;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;background:var(--fondo);color:var(--tinta);font:400 17px/1.5 var(--ui);-webkit-font-smoothing:antialiased;
  padding-left:max(16px, env(safe-area-inset-left, 0px));padding-right:max(16px, env(safe-area-inset-right, 0px))}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--arena);outline-offset:2px}
h1,h2,h3,p{margin:0}
.num{font-variant-numeric:tabular-nums}

/* ---------- armazón */
.app{max-width:440px;margin:0 auto;padding-block:12px 112px}
.app.ancha{max-width:1060px}
.pantalla{display:flex;flex-direction:column;gap:24px}
.pantalla[hidden]{display:none!important}
.barra{display:flex;align-items:center;gap:12px;min-height:52px}
.barra h1{font:600 30px/1.1 var(--display);letter-spacing:.005em}
.barra .lado{margin-left:auto;display:flex;align-items:center;gap:8px}
.icono-boton{width:48px;height:48px;border-radius:50%;border:0;background:transparent;display:grid;place-items:center;color:var(--tinta)}
.icono-boton:active{background:var(--hundido)}
svg.i{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.etiqueta-ejemplo{font:500 13px/1 var(--ui);color:var(--aviso);background:var(--aviso-suave);padding:6px 10px;border-radius:999px;white-space:nowrap}
.seccion{display:flex;flex-direction:column;gap:12px}
.seccion > h2{font:600 18px/1.3 var(--ui)}
.ayuda{font-size:15px;color:var(--tinta-3)}

/* ---------- botones */
.btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 20px;border-radius:var(--r-boton);
  border:1.5px solid transparent;font:600 17px/1.2 var(--ui);text-decoration:none;transition:background-color .15s, transform .15s}
.btn:active{transform:scale(.98)}
.btn-primario{background:var(--olivo);color:var(--sobre-olivo)}
.btn-primario:hover{background:var(--olivo-oscuro)}
.btn-primario[disabled]{background:#B8B1AA;color:#F8F4F1;cursor:not-allowed;transform:none}
.btn-secundario{background:var(--superficie);border-color:var(--linea-fuerte);color:var(--tinta)}
.btn-secundario:hover{background:var(--hundido)}
.btn-secundario[disabled]{background:var(--hundido);border-color:var(--linea);color:#8F8881;cursor:not-allowed;transform:none}
.btn-texto{background:transparent;color:var(--olivo);min-height:48px;padding:0 8px}
.btn-grande{min-height:64px;font-size:18px}
.btn-bloque{width:100%}

/* ---------- campos */
.campo{display:flex;flex-direction:column;gap:8px}
.campo > label,.campo > .rotulo{font:500 15px/1.3 var(--ui);color:var(--tinta-2)}
.campo .opcional{font-weight:400;color:var(--tinta-3)}
.entrada{width:100%;min-height:56px;padding:0 16px;border-radius:var(--r);border:1.5px solid var(--borde-control);background:var(--superficie);
  font-size:17px;transition:border-color .15s, box-shadow .15s}
.entrada::placeholder{color:#746E68}
.entrada:focus{outline:none;border-color:var(--olivo);box-shadow:0 0 0 3px rgba(88,94,73,.18)}
textarea.entrada{min-height:104px;padding:14px 16px;resize:vertical;line-height:1.45}
.con-prefijo{display:flex;align-items:stretch;border-radius:var(--r);border:1.5px solid var(--borde-control);background:var(--superficie);overflow:hidden}
.con-prefijo:focus-within{border-color:var(--olivo);box-shadow:0 0 0 3px rgba(88,94,73,.18)}
.con-prefijo span{display:grid;place-items:center;padding:0 14px;background:var(--hundido);color:var(--tinta-2);font-weight:500}
.con-prefijo .entrada{border:0;border-radius:0;box-shadow:none}
.con-sufijo{position:relative}
.con-sufijo .entrada{padding-right:56px}
.con-sufijo span{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:var(--tinta-2);font-weight:500}
.fila{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.nota{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--r);background:var(--hundido);font-size:15px;color:var(--tinta-2)}
.nota.cargo{background:var(--arena-suave);color:#6B4F2E}
.nota svg.i{width:20px;height:20px;flex:none;margin-top:1px}

/* ---------- opciones (botones de elección) */
.opciones{display:flex;flex-wrap:wrap;gap:8px}
.opcion{min-height:48px;padding:0 18px;border-radius:999px;border:1.5px solid var(--borde-control);background:var(--superficie);
  font:500 17px/1 var(--ui);display:inline-flex;align-items:center;gap:8px;transition:background-color .15s,border-color .15s,color .15s}
.opcion small{font:500 13px/1 var(--ui);color:#7A5A33;background:var(--arena-suave);padding:4px 7px;border-radius:999px}
.opcion[aria-pressed="true"]{background:var(--olivo);border-color:var(--olivo);color:var(--sobre-olivo)}
.opcion[aria-pressed="true"] small{background:rgba(248,244,241,.18);color:var(--sobre-olivo)}
.zonas{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.lista-titulo{margin-top:6px;font:500 15px/1.3 var(--ui);color:var(--tinta-3)}
.interruptor{display:flex;align-items:center;gap:14px;min-height:64px;padding:12px 16px;border-radius:var(--r);border:1.5px solid var(--linea-fuerte);background:var(--superficie)}
.interruptor input{width:26px;height:26px;accent-color:var(--olivo);flex:none}
.interruptor b{font-weight:500}
.interruptor span{display:block;font-size:15px;color:var(--tinta-3)}

/* ---------- PIN */
.entrada-pin{align-items:center;text-align:center;padding-top:24px;gap:28px}
.entrada-pin .logo{width:150px}
.puntos{display:flex;gap:16px;justify-content:center;height:20px}
.puntos i{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--tinta-2)}
.puntos i.lleno{background:var(--tinta);border-color:var(--tinta)}
.teclado{display:grid;grid-template-columns:repeat(3, 80px);gap:12px 28px;justify-content:center}
.tecla{height:72px;border-radius:50%;border:0;background:var(--superficie);font:500 28px/1 var(--ui);box-shadow:inset 0 0 0 1.5px var(--linea)}
.tecla:active{background:var(--hundido)}
.tecla.sin{background:transparent;box-shadow:none}
.mensaje-error{color:var(--error);font-weight:500;min-height:24px}

/* ---------- inicio */
.saludo p{color:var(--tinta-2);font-size:16px}
.saludo h1{font:600 30px/1.15 var(--display)}
.estado-red{display:inline-flex;align-items:center;gap:6px;font:500 14px/1 var(--ui);color:var(--bien);background:var(--bien-suave);padding:7px 11px;border-radius:999px}
.estado-red i{width:8px;height:8px;border-radius:50%;background:currentColor}
.estado-red.fuera{color:var(--aviso);background:var(--aviso-suave)}
.pendientes{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pendiente{display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;padding:16px;border-radius:var(--r);border:1.5px solid var(--linea);background:var(--superficie)}
.pendiente b{font:600 30px/1 var(--ui)}
.pendiente span{font-size:15px;color:var(--tinta-2);line-height:1.3}
.pendiente.alerta{border-color:#E5C79A;background:#FBF4E8}
.lista{display:flex;flex-direction:column;border-top:1px solid var(--linea)}
.renglon{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center;padding:14px 4px;border:0;border-bottom:1px solid var(--linea);background:transparent;text-align:left;width:100%}
.renglon:active{background:var(--hundido)}
.renglon b{font-weight:600}
.renglon .meta{grid-column:1;font-size:15px;color:var(--tinta-2)}
.renglon .costo{grid-row:1;grid-column:2;text-align:right;font-weight:500}
.renglon .marca{grid-column:2;justify-self:end}
.chip{display:inline-flex;align-items:center;gap:5px;font:500 15px/1 var(--ui);padding:6px 10px;border-radius:999px;white-space:nowrap}
.chip.por{background:var(--arena-suave);color:#6B4F2E}
.chip.ok{background:var(--bien-suave);color:var(--bien)}
.chip.sin{background:var(--error-suave);color:var(--error)}

/* ---------- navegación de abajo */
.nav{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--superficie);border-top:1px solid var(--linea);
  padding:6px max(16px, env(safe-area-inset-right, 0px)) calc(6px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px))}
.nav[hidden]{display:none!important}
.nav div{max-width:440px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr)}
.nav a{display:flex;flex-direction:column;align-items:center;gap:3px;min-height:52px;justify-content:center;color:var(--tinta-3);text-decoration:none;font:500 13px/1 var(--ui);border-radius:10px}
.nav a[aria-current="page"]{color:var(--olivo)}
.nav a[aria-current="page"] svg.i{stroke-width:2.1}
.nav a.solo-admin[hidden]{display:none}

/* ---------- nuevo servicio */
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.pasos button{display:flex;flex-direction:column;gap:8px;border:0;background:transparent;padding:0 0 6px;min-height:48px;text-align:left;font:500 15px/1.2 var(--ui);color:var(--tinta-3)}
.pasos i{display:block;height:4px;border-radius:2px;background:var(--linea)}
.pasos button.hecho i{background:var(--olivo)}
.pasos button[aria-current="step"]{color:var(--tinta);font-weight:600}
.rejilla{display:grid;gap:8px}
.rejilla-5{grid-template-columns:repeat(5,minmax(0,1fr))}
.rejilla-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.rejilla .opcion{border-radius:12px;justify-content:center;padding:0 4px;min-width:0}
.bloque{display:flex;flex-direction:column;gap:20px}
.bloque[hidden]{display:none!important}
.foto{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:148px;border-radius:var(--r);
  border:1.5px dashed var(--linea-fuerte);background:var(--superficie);color:var(--tinta-2);font-weight:500;text-align:center;padding:16px;position:relative;overflow:hidden}
.foto input{position:absolute;inset:0;opacity:0;cursor:pointer}
.foto img{max-height:220px;border-radius:8px}
.cuenta{position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--superficie);border-top:1px solid var(--linea);
  padding:12px max(16px, env(safe-area-inset-right, 0px)) calc(12px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px))}
.cuenta[hidden]{display:none!important}
.cuenta > div{max-width:440px;margin:0 auto;display:flex;align-items:center;gap:14px}
.cuenta .total{display:flex;flex-direction:column;min-width:0;flex:1}
.cuenta .total span{font-size:15px;line-height:1.3;color:var(--tinta-2)}
.cuenta .total b{font:600 26px/1.1 var(--ui)}
.cuenta .btn{flex:none;min-width:150px}

/* ---------- certificado (la plantilla aprobada, a escala) */
.cert-marco{position:relative;width:100%;aspect-ratio:816/1056;max-width:100%;border-radius:4px;overflow:hidden;background:#F6F0ED;
  box-shadow:0 1px 2px rgba(63,61,58,.16),0 4px 8px rgba(63,61,58,.10)}
.cert{position:absolute;left:0;top:0;width:816px;height:1056px;transform-origin:0 0;background:#F6F0ED url("/assets/certificado/fondo-sendero.jpg") 0 0/816px 1056px no-repeat;color:#3F3D3A}
.cert .rastro{position:absolute;left:0;top:0}
.cert .logo{position:absolute;left:306px;top:72px;width:204px}
.cert .grupo{position:absolute;left:88px;right:88px;top:476px;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;text-align:center}
.cert .nombre{font:600 var(--n,82px)/1.06 var(--display);letter-spacing:.06em;padding-left:.06em;text-transform:uppercase}
.cert .raza{margin-top:12px;font:italic 500 32px/1.25 var(--display);color:#5F5A55}
.cert .separador{margin-top:26px;display:block}
.cert .fecha{margin-top:22px;font:500 31px/1.2 var(--display);letter-spacing:.04em;font-variant-numeric:lining-nums}
.cert .pie{position:absolute;left:60px;right:60px;bottom:62px;text-align:center;font:500 20px/1.42 var(--display);color:#F6F0ED;font-variant-numeric:lining-nums}
.cert .pie .marca{font-weight:600;font-size:17px;letter-spacing:.05em;margin-bottom:3px}
.resumen{display:flex;flex-direction:column;border-top:1px solid var(--linea)}
.resumen div{display:flex;justify-content:space-between;gap:16px;padding:12px 2px;border-bottom:1px solid var(--linea);font-size:16px}
.resumen dt,.resumen span:first-child{color:var(--tinta-2)}
.resumen b{font-weight:500;text-align:right}

/* ---------- listo */
.hecho-icono{width:72px;height:72px;border-radius:50%;background:var(--olivo);color:var(--sobre-olivo);display:grid;place-items:center;margin:8px auto 0}
.hecho-icono svg.i{width:36px;height:36px;stroke-width:2.2}
.centro{text-align:center}
.centro h1{font:600 32px/1.15 var(--display)}
.centro p{color:var(--tinta-2)}
.pasos-hechos{display:flex;flex-direction:column;gap:2px;border-radius:var(--r);background:var(--superficie);border:1.5px solid var(--linea);padding:6px 16px}
.pasos-hechos div{display:flex;align-items:center;gap:12px;padding:10px 0;font-size:16px}
.pasos-hechos div + div{border-top:1px solid var(--linea)}
.pasos-hechos svg.i{color:var(--bien);flex:none}
.pasos-hechos .falla svg.i{color:var(--error)}
.confirmacion{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--r);background:var(--bien-suave);color:#2F4A2A;font-size:16px;line-height:1.45}
.confirmacion svg.i{flex:none;margin-top:1px}
.confirmacion.falla{background:var(--error-suave);color:#6E2A23}
.saludo-wa{padding:14px 16px;border-radius:var(--r);background:#E7F2DD;color:#24331C;font-size:16px;line-height:1.45}

/* ---------- aviso flotante */
.aviso{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom, 0px));transform:translate(-50%, 12px);z-index:40;max-width:min(400px, calc(100vw - 32px));
  background:var(--tinta);color:var(--fondo);font-size:15px;padding:12px 16px;border-radius:12px;opacity:0;pointer-events:none;transition:opacity .2s, transform .2s}
.aviso.ver{opacity:1;transform:translate(-50%, 0)}
.banda{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--r);font-size:15px;line-height:1.4}
.banda svg.i{flex:none;width:22px;height:22px}
.banda.aviso-amarillo{background:var(--aviso-suave);color:#5E3D0B}
.banda.aviso-rojo{background:var(--error-suave);color:#6E2A23}
.banda b{display:block;font-weight:600;margin-bottom:2px}

/* ---------- tablero */
.tablero{display:grid;gap:28px}
@media (min-width:900px){.tablero{grid-template-columns:1.15fr 1fr;align-items:start}}
.col{display:flex;flex-direction:column;gap:28px;min-width:0}
.cifras{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--linea);border:1px solid var(--linea);border-radius:var(--r);overflow:hidden}
.cifra{background:var(--superficie);padding:14px 16px;display:flex;flex-direction:column;gap:4px;min-width:0}
.cifra span{font-size:14px;color:var(--tinta-2)}
.cifra b{font:600 28px/1.1 var(--ui)}
.cifra em{font-style:normal;font-size:14px;color:var(--tinta-3)}
.cifra em.sube{color:var(--bien)}
.cifra em.baja{color:var(--error)}
.cifra.ancha{grid-column:1 / -1}
.meta-barra{height:12px;border-radius:6px;background:var(--hundido);position:relative;overflow:hidden}
.meta-barra i{position:absolute;left:0;top:0;bottom:0;background:var(--olivo);border-radius:6px}
.meta-barra u{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--tinta);text-decoration:none}
.meta-texto{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 16px;font-size:15px;color:var(--tinta-2)}
.meta-texto span{white-space:nowrap}
.grafica{position:relative}
.grafica svg{display:block;width:100%;height:auto;overflow:visible}
.grafica .tip{position:absolute;pointer-events:none;background:var(--tinta);color:var(--fondo);font-size:14px;padding:8px 10px;border-radius:8px;white-space:nowrap;transform:translate(-50%, -100%);opacity:0;transition:opacity .12s}
.barras{display:flex;flex-direction:column;gap:10px}
.barra-h{display:grid;grid-template-columns:minmax(0, 1fr) auto;gap:4px 12px;align-items:center;font-size:15px}
.barra-h .pista{grid-column:1 / -1;height:8px;border-radius:4px;background:var(--hundido);overflow:hidden}
.barra-h .pista i{display:block;height:100%;background:var(--olivo);border-radius:4px}
.barra-h b{font-weight:500}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width:420px){.dos{grid-template-columns:1fr}}
.pie-nota{font-size:14px;color:var(--tinta-3)}

/* ---------- ajustes y correo */
.ajuste{display:flex;align-items:center;gap:12px;padding:14px 4px;border-bottom:1px solid var(--linea)}
.ajuste .crece{flex:1;min-width:0}
.ajuste b{font-weight:500}
.ajuste .crece > span{display:block;font-size:15px;color:var(--tinta-3)}
.ajuste input[type="checkbox"]{width:24px;height:24px;accent-color:var(--olivo)}
.precios{width:100%;border-collapse:collapse;font-size:16px}
.ajuste.ir{text-decoration:none;color:inherit}
.tag-gmail{display:inline-block;font:500 13px/1 var(--ui);padding:5px 8px;border-radius:5px;background:#E8EAED;color:#3C4043;vertical-align:1px;white-space:nowrap}
.ajuste.ir svg.i{color:var(--tinta-3);flex:none}
.ajuste label.crece{cursor:pointer}
.con-prefijo.corto{width:160px;flex:none}
.con-prefijo.corto .entrada{min-height:48px;padding:0 12px}
.fila-agregar{display:flex;gap:8px}
.fila-agregar .entrada{flex:1;min-width:0}
.fila-agregar .btn{flex:none}
.persona{display:flex;flex-direction:column;gap:12px;padding:16px 0;border-bottom:1px solid var(--linea)}
.etiquetas{display:flex;flex-wrap:wrap;gap:8px}
.etiqueta{display:inline-flex;align-items:center;gap:2px;min-height:44px;padding:0 4px 0 14px;border-radius:999px;background:var(--hundido);font-weight:500}
.etiqueta button{width:44px;height:44px;border:0;border-radius:50%;background:transparent;font-size:20px;line-height:1;color:var(--tinta-2)}
#guardar-estado{font-size:15px;color:var(--tinta-3)}
.precios td{padding:10px 4px;border-bottom:1px solid var(--linea)}
.precios td:last-child{text-align:right}
.correo{border:1.5px solid var(--linea);border-radius:var(--r);background:#fff;overflow:hidden}
.correo .cab{padding:14px 16px;border-bottom:1px solid var(--linea);font-size:15px;color:var(--tinta-2);display:grid;gap:4px}
.correo .cab b{color:var(--tinta);font-weight:600}
.correo .cuerpo{padding:24px 20px;display:flex;flex-direction:column;gap:14px;font-size:16px}
.correo .cuerpo img{width:110px}
.adjunto{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--linea);border-radius:10px;font-size:15px}
.adjunto .pdf{width:34px;height:40px;border-radius:5px;background:#B4463C;color:#fff;font:700 10px/1 var(--ui);display:grid;place-items:center}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---------- de la app (no estaban en el prototipo: errores junto al campo, vacíos y estados de espera) */
.campo-error{font:500 15px/1.35 var(--ui);color:var(--error)}
.campo.con-error .entrada,.campo.con-error .con-prefijo{border-color:var(--error)}
.campo.con-error .opciones .opcion[aria-pressed="false"]{border-color:#D9A9A2}
.vacio{padding:18px 4px;color:var(--tinta-3);font-size:15px;border-bottom:1px solid var(--linea)}
.banda div span{display:block}
.nota.esperando{background:var(--hundido);color:var(--tinta-2)}
.nota.esperando svg.i{animation:girar 1.1s linear infinite}
@keyframes girar{to{transform:rotate(360deg)}}
.pendiente[disabled]{cursor:default}
.renglon .chip.cola{background:var(--hundido);color:var(--tinta-2)}
@media (prefers-reduced-motion:reduce){.nota.esperando svg.i{animation:none}}
.enlace-tocable{display:inline-block;padding:13px 0;margin:-13px 0;color:var(--olivo);font-weight:500}
.hecho-icono.falla{background:var(--aviso)}
.dialogo{border:0;border-radius:16px;padding:24px 20px 16px;max-width:min(400px, calc(100vw - 32px));background:var(--superficie);color:var(--tinta);
  box-shadow:0 8px 28px rgba(63,61,58,.22)}
.dialogo::backdrop{background:rgba(63,61,58,.38)}
.dialogo h2{font:600 24px/1.2 var(--display);margin-bottom:8px}
.dialogo p{color:var(--tinta-2);font-size:16px;line-height:1.45}
.dialogo .botones{display:flex;flex-direction:column;gap:8px;margin-top:20px}
.mas{align-self:center}
button.enlace-tocable{border:0;background:none;font:500 15px/1.3 var(--ui);cursor:pointer;text-align:left;padding:13px 0;margin:-6px 0 -13px}
#lista-titulo{font:600 18px/1.3 var(--ui)}
.cert .nombre{white-space:nowrap}
.ajuste .crece b{overflow-wrap:anywhere}