/* refine.css — se carga al final: afina botones (más finos y redondeados) sin tocar el resto del sistema */
/* ===== botones más finos y redondeados (toda la app y el landing) ===== */
.mediador-app button.primary, .mediador-app button.ghost, .mediador-app button.danger,
.mediador-app .btn-primary, .mediador-app .btn-secondary{
  height: 36px; padding: 0 18px; border-radius: var(--radius-pill); font-weight: 500; font-size: 14px; letter-spacing: 0;
}
.mediador-app button.primary, .mediador-app .btn-primary{ box-shadow: none; }
.mediador-app .btn-sm, .mediador-app button.btn-sm{ height: 30px; padding: 0 14px; font-size: 13px; }
.mediador-app .btn-lg{ height: 42px; padding: 0 22px; font-size: 15px; }
/* botones de ancho completo: finos pero cómodos al tacto */
.mediador-app .med-card-open{ min-height: 40px; height: 40px; border-radius: var(--radius-pill); font-size: 14.5px; font-weight: 500; }
.mediador-app .med-card-actions button{ min-height: 38px; height: 38px; border-radius: var(--radius-pill); font-weight: 500; font-size: 13.5px; }
.mediador-app .exp-hero-actions > button, .mediador-app .exp-hero-mini button{ min-height: 44px; height: 44px; border-radius: var(--radius-pill); font-weight: 500; font-size: 15px; }
.mediador-app .exp-hero-state button, .mediador-app .exp-hero-edit{ border-radius: var(--radius-pill); font-weight: 500; }
.mediador-app .exp-hero-edit{ width: 40px; height: 40px; }
.mediador-app .topbar-support{ border-radius: var(--radius-pill); font-weight: 500; }
/* landing */
.mediador-app .lp-btn{ height: 38px; padding: 0 20px; border-radius: var(--radius-pill); font-weight: 500; font-size: 14px; }
.mediador-app .lp-btn-lg{ height: 46px; padding: 0 26px; font-size: 15px; }
.mediador-app a.google-btn, .mediador-app button.google-btn{ border-radius: var(--radius-pill); font-weight: 500; height: 40px; }
@media (max-width: 767px){
  /* en el celular los botones del inicio ocupan lo que dice su texto, centrados */
  .mediador-app .lp-hero-actions{ align-items: center; }
  .mediador-app .lp-hero-actions .lp-btn, .mediador-app .lp-hero-actions .google-btn{ width: auto; max-width: 100%; }
}

/* ===== botones con el ancho de su texto (no de punta a punta) ===== */
.mediador-app button[style*="width:100%"], .mediador-app button[style*="width: 100%"],
.mediador-app a[class*="btn"][style*="width:100%"], .mediador-app a[class*="btn"][style*="width: 100%"],
.mediador-app .dash-header-actions .dash-continue-btn, .mediador-app .dash-header-actions .hero-create-btn,
.mediador-app .attn-action, .mediador-app .med-card-open{
  width: auto !important; align-self: flex-start; flex: 0 0 auto;
}
.mediador-app .med-card-open{ padding: 0 26px; }
/* grupos de acciones: se acomodan en fila, cada botón con su ancho */
.mediador-app .med-card-actions{ display: flex; flex-wrap: wrap; gap: 8px; }
.mediador-app .med-card-actions button{ width: auto; padding: 0 16px; }
.mediador-app .exp-hero-actions{ display: flex; flex-wrap: wrap; gap: 10px; }
.mediador-app .exp-hero-actions > button{ width: auto; padding: 0 22px; }
.mediador-app .exp-hero-mini{ display: contents; }
.mediador-app .exp-hero-mini button{ width: auto; padding: 0 22px; }
/* botones propios del inicio y de la lista de atención: misma línea fina
   (el botón principal "Nueva mediación" del inicio conserva su estilo robusto con sombra) */
.mediador-app .dash-continue-btn{ height: 38px; padding: 0 18px; border-radius: var(--radius-pill); font-weight: 500; font-size: 14px; }
.mediador-app .attn-action{ height: 34px; padding: 0 16px; border-radius: var(--radius-pill); font-weight: 500; font-size: 13.5px; }

/* inicio en el celular: los tres botones centrados y con la misma línea (el principal se distingue por su color) */
@media (max-width: 767px){
  .mediador-app .dash-header-actions{ align-items: center; gap: 10px; }
  .mediador-app .dash-header-actions .dash-continue-btn,
  .mediador-app .dash-header-actions .hero-create-btn,
  .mediador-app .dash-header-actions > button{ align-self: center; }
  .mediador-app .hero-create-btn{ height: 44px; padding: 0 28px; border-radius: var(--radius-pill); font-size: 15px; font-weight: 600; box-shadow: 0 6px 16px rgba(21,155,145,.28); }
  .mediador-app .hero-create-btn:hover, .mediador-app .hero-create-btn:active{ box-shadow: 0 6px 16px rgba(21,155,145,.28); transform: none; }
}

/* título de sección: solo en el celular */
.mediador-app .topbar-title{ display: none; }
.mediador-app .dash-search-mobile{ display: none; }
.mediador-app .dash-personalize svg{ display: none; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 767px){
  /* barra: menú grande + nombre de la sección; sin logo ni buscador */
  .mediador-app .topbar{ gap: 4px; }
  .mediador-app .topbar-menu-btn{ width: 48px; height: 48px; border-radius: 14px; margin-left: -6px; }
  .mediador-app .topbar-menu-btn svg{ width: 30px; height: 30px; stroke-width: 2.1; }
  .mediador-app .topbar-title{ display: block; flex: 1 1 auto; min-width: 0; font-size: 20px; font-weight: 700; letter-spacing: -.01em; color: var(--color-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .mediador-app .topbar-logo-mobile{ display: none !important; }
  .mediador-app .topbar-search-icon-btn{ display: none !important; }
  .mediador-app .topbar-search-wrap:not(.search-open){ display: none; }
  .mediador-app .topbar.topbar-search-active .topbar-title{ display: none; }
  .mediador-app .topbar-actions{ margin-left: auto; }

  /* buscador dentro del Inicio */
  .mediador-app .dash-search-mobile{ display: flex; align-items: center; gap: 10px; width: 100%; margin: 4px 0 14px; padding: 0 16px; height: 44px; border: 1px solid var(--color-border-light); border-radius: var(--radius-pill); background: var(--color-surface); color: var(--color-text-muted); font: inherit; font-size: 14.5px; cursor: pointer; text-align: left; }
  .mediador-app .dash-search-mobile svg{ width: 18px; height: 18px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

  /* botones del inicio: una sola fila corta en vez de tres apilados */
  .mediador-app .dash-header-actions{ flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px 10px; }
  .mediador-app .dash-header-actions .hero-create-btn{ order: 1; height: 42px; padding: 0 22px; font-size: 15px; }
  .mediador-app .dash-header-actions .dash-personalize{ order: 2; flex: 0 0 42px; width: 42px; min-width: 42px; height: 42px; padding: 0; border-radius: 50%; }
  .mediador-app .dash-header-actions .dash-personalize svg{ display: block; }
  .mediador-app .dash-header-actions .dash-personalize .lbl{ display: none; }
  .mediador-app .dash-header-actions a.dash-continue-btn{ order: 3; flex: 1 0 100%; justify-content: center; height: auto; padding: 2px 0 0; border: 0; background: none; box-shadow: none; color: var(--color-brand-dark); font-size: 14px; font-weight: 600; }
}

/* botones circulares de la barra (ayuda, soporte, avisos) */
.mediador-app .topbar-help{ display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid var(--color-border-light); border-radius: 50%; background: var(--color-surface); color: var(--color-text-secondary); cursor: pointer; }
.mediador-app .topbar-help svg{ width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.mediador-app .topbar-help:hover{ color: var(--color-text); background: var(--color-brand-soft); }

@media (max-width: 767px){
  /* barra superior como tarjeta flotante redondeada */
  .mediador-app .topbar{ position: sticky; top: 8px; margin: 8px 10px 0; height: 64px; padding: 0 10px; border: 1px solid var(--color-border-light); border-radius: 28px; background: var(--color-surface); box-shadow: 0 6px 22px rgba(20,35,60,.10); }
  .mediador-app .topbar-actions{ gap: 6px; }
  .mediador-app .topbar-help, .mediador-app .topbar-support, .mediador-app .topbar-bell{ width: 42px; height: 42px; min-width: 42px; padding: 0; border: 1px solid #dfe3f0; border-radius: 50%; background: #eef1f8; justify-content: center; }
  .mediador-app .topbar-help{ color: #2b3a67; }
  .mediador-app .topbar-support{ color: #d9622b; }
  .mediador-app .topbar-bell{ color: #2b3a67; }
  .mediador-app .topbar-help svg, .mediador-app .topbar-support svg, .mediador-app .topbar-bell svg{ width: 20px; height: 20px; }
  .mediador-app .topbar-support-label{ display: none; }
}

/* ===== inicio (dashboard) ===== */
.mediador-app .dash-greet{ color: var(--color-text-secondary, #6b7a80); font-weight: 600; }

@media (max-width: 767px){
  .mediador-app .dash-header h1{ font-size: 28px; line-height: 1.15; letter-spacing: -.02em; }
  .mediador-app .dash-header p{ font-size: 15px; }

  /* indicadores: una sola tarjeta, dos columnas con divisores */
  .mediador-app .kpi-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 0; background: var(--color-surface); border: 1px solid var(--color-border-light); border-radius: 22px; overflow: hidden; margin-bottom: 16px; }
  .mediador-app .kpi-grid .kpi-card{ border: 0; border-radius: 0; box-shadow: none; background: transparent; padding: 16px 16px 14px; border-bottom: 1px solid var(--color-border-light); }
  .mediador-app .kpi-grid .kpi-card:nth-child(odd){ border-right: 1px solid var(--color-border-light); }
  .mediador-app .kpi-grid .kpi-card:last-child{ border-bottom: 0; }
  .mediador-app .kpi-grid .kpi-card:nth-last-child(2):nth-child(odd){ border-bottom: 0; }
  .mediador-app .kpi-grid .kpi-card:last-child:nth-child(odd){ grid-column: 1 / -1; border-right: 0; }
  .mediador-app .kpi-card-head{ gap: 10px; align-items: center; }
  .mediador-app .kpi-card-head > span:last-child{ text-transform: uppercase; letter-spacing: .12em; font-size: 11.5px; font-weight: 600; color: var(--color-text-muted); line-height: 1.3; }
  .mediador-app .kpi-icon{ flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--color-border-light); }
  .mediador-app .kpi-value{ font-size: 34px; font-weight: 800; letter-spacing: -.02em; margin-top: 10px; }
  .mediador-app .kpi-sub{ font-size: 14px; color: var(--color-text-muted); }
}

/* ===== landing en computadora: menos aire entre bloques y títulos que entran en una línea ===== */
@media (min-width: 768px){
  .mediador-app .lp-section{ padding: 60px 0; }
  .mediador-app .lp-section.is-tight{ padding: 40px 0; }
  .mediador-app .lp-section-head{ max-width: 820px; margin-bottom: 28px; }
  .mediador-app .lp-section-head.is-center{ max-width: 900px; }
  .mediador-app .lp-section h2{ font-size: 34px; text-wrap: balance; }
  .mediador-app .lp-section-head p{ margin-top: 12px; text-wrap: pretty; }
  .mediador-app .lp-section-head.is-center p{ max-width: 780px; margin-left: auto; margin-right: auto; }
  .mediador-app .lp-hero{ padding: 40px 0 24px; }
  .mediador-app .lp-hero.is-full{ min-height: 0; }
  .mediador-app .lp-frame-wrap{ margin-top: 24px; }
  .mediador-app .lp-cta-final{ padding-top: 48px; padding-bottom: 56px; }
}

/* sección actual en la barra de las páginas públicas */
.lp-nav-links a.is-active{ color: var(--lp-text); font-weight: 600; }
.lp-mobile-menu a.is-active{ color: var(--lp-ink, var(--lp-accent)); font-weight: 600; }

/* inicio en el celular: botón de personalizar bien centrado y alineado con "Nueva mediación" */
@media (max-width: 767px){
  .mediador-app .dash-header-actions{ align-items: center; }
  .mediador-app .dash-header-actions .dash-personalize{
    display: inline-flex; align-items: center; justify-content: center; gap: 0;
    flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; padding: 0 !important; margin: 0;
    border: 1px solid var(--color-border-light); border-radius: 50%; background: var(--color-surface); color: var(--color-text-secondary);
    box-shadow: none; line-height: 0;
  }
  .mediador-app .dash-header-actions .dash-personalize svg{ display: block; width: 20px; height: 20px; margin: 0; flex: 0 0 20px; }
  .mediador-app .dash-header-actions .hero-create-btn{ height: 44px; }
}

/* inicio en el celular: "Nueva mediación" sola y, debajo, dos enlaces de texto en una línea */
.mediador-app .dash-break{ display: none; }
@media (max-width: 767px){
  .mediador-app .dash-header-actions{ display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 22px; }
  .mediador-app .dash-header-actions .hero-create-btn{ order: 1; flex: 0 0 auto; }
  .mediador-app .dash-break{ display: block; order: 2; flex: 0 0 100%; height: 0; margin: 4px 0 0; }
  .mediador-app .dash-header-actions a.dash-continue-btn{ order: 3; flex: 0 0 auto; display: inline-flex; padding: 4px 0; font-size: 14px; }
  .mediador-app .dash-header-actions .dash-personalize{
    order: 4; flex: 0 0 auto; width: auto; min-width: 0; height: auto; padding: 4px 0 !important; gap: 6px;
    border: 0; border-radius: 0; background: none; color: var(--color-text-secondary); font-size: 14px; font-weight: 600;
  }
  .mediador-app .dash-header-actions .dash-personalize .lbl{ display: inline; }
  .mediador-app .dash-header-actions .dash-personalize svg{ width: 16px; height: 16px; flex: 0 0 16px; }
}

/* ===== páginas públicas: lectura con movimiento (ver public/site-chrome.js) ===== */
.lp-root .legal-wrap{ position: relative; z-index: 1; }
.lp-root .legal-wrap h2{ scroll-margin-top: 92px; }
.read-progress{ position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 60; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, var(--color-brand), #2f6fc8); pointer-events: none; }
.lp-root .read-meta{ display: flex; gap: 8px; flex-wrap: wrap; margin: -10px 0 16px; }
.lp-root .read-pill{ display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; background: var(--lp-glass); border: 1px solid var(--lp-glass-border); color: var(--lp-text-dim); font-size: 12.5px; font-weight: 500; }
.lp-root .read-pill i{ font-style: normal; opacity: .8; }
.lp-root .toc-chips{ display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 0 0 28px; padding: 12px 14px; border: 1px solid var(--lp-glass-border); border-radius: 16px; background: var(--lp-glass); }
.lp-root .toc-label{ font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--lp-text-dim); margin-right: 4px; }
.lp-root .legal-wrap .toc-chips a{ padding: 6px 13px; border-radius: 999px; border: 1px solid var(--lp-glass-border-strong); background: var(--lp-panel); color: var(--lp-text); text-decoration: none; font-size: 13.5px; transition: background .2s, border-color .2s, transform .2s; }
.lp-root .legal-wrap .toc-chips a:hover, .lp-root .legal-wrap .toc-chips a.on{ border-color: var(--lp-ink, var(--lp-accent)); background: var(--lp-accent-dim); color: var(--lp-text); transform: translateY(-1px); }
.lp-root .legal-wrap .toc-chips a.on{ font-weight: 600; }
.lp-root .end-cta{ display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 40px 0 8px; padding: 22px 24px; border-radius: 20px; border: 1px solid rgba(34,199,184,.38); background: linear-gradient(135deg, var(--lp-accent-dim), var(--lp-glass)); }
.lp-root .end-cta-text{ display: grid; gap: 4px; max-width: 520px; }
.lp-root .end-cta-text strong{ font-size: 18px; color: var(--lp-text); }
.lp-root .end-cta-text span{ color: var(--lp-text-dim); line-height: 1.5; font-size: 14.5px; }
.lp-root .recurso-card{ transition: transform .3s var(--lp-ease, ease), border-color .2s, box-shadow .3s; }
.lp-root .recurso-card:hover{ transform: translateY(-4px); box-shadow: 0 16px 36px rgba(20,35,43,.12); }
@media (max-width: 767px){ .lp-root .end-cta{ padding: 18px; } .lp-root .toc-chips{ flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .lp-root .toc-chips::-webkit-scrollbar{ display: none; } .lp-root .toc-chips a, .lp-root .toc-label{ flex: 0 0 auto; white-space: nowrap; } }
@media print, (prefers-reduced-motion: reduce){
  .lp-js [data-reveal]{ opacity: 1 !important; transform: none !important; transition: none !important; }
  .read-progress{ display: none; }
}

/* buscador del Inicio en el celular: campo propio con resultados debajo */
@media (max-width: 767px){
  .mediador-app .dash-search-mobile{ display: block; position: relative; height: auto; padding: 0; margin: 4px 0 14px; border: 0; background: none; z-index: 5; }
  .mediador-app .dash-search-field{ display: flex; align-items: center; gap: 10px; height: 46px; padding: 0 16px; border: 1px solid var(--color-border-light); border-radius: var(--radius-pill); background: var(--color-surface); margin: 0; cursor: text; }
  .mediador-app .dash-search-field:focus-within{ border-color: var(--color-brand); box-shadow: 0 0 0 3px rgba(34,199,184,.18); }
  .mediador-app .dash-search-field svg{ width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: var(--color-text-muted); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .mediador-app .dash-search-field input{ flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; padding: 0; font: inherit; font-size: 15px; color: var(--color-text); box-shadow: none; -webkit-appearance: none; appearance: none; }
  .mediador-app .dash-search-field input::-webkit-search-cancel-button{ -webkit-appearance: none; }
  .mediador-app .dash-search-results{ position: absolute; left: 0; right: 0; top: calc(100% + 6px); max-height: 52vh; overflow-y: auto; border: 1px solid var(--color-border-light); border-radius: 18px; background: var(--color-surface); box-shadow: 0 14px 36px rgba(20,35,60,.16); padding: 6px; }
  .mediador-app .dash-search-result{ display: grid; gap: 2px; padding: 11px 12px; border-radius: 12px; text-decoration: none; color: var(--color-text); }
  .mediador-app .dash-search-result:hover, .mediador-app .dash-search-result:active{ background: var(--color-brand-soft); }
  .mediador-app .dash-search-result .code{ font-family: var(--font-mono); font-size: 12.5px; font-weight: 700; color: var(--color-brand-dark); }
  .mediador-app .dash-search-result .obj{ font-size: 15px; font-weight: 600; }
  .mediador-app .dash-search-result .hint{ font-size: 12.5px; color: var(--color-text-muted); }
  .mediador-app .dash-search-empty{ padding: 14px; text-align: center; color: var(--color-text-muted); font-size: 14px; }
}
@media (max-width: 767px){
  .mediador-app .dash-search-mobile .dash-search-field input[type="search"]{ border: 0 !important; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important; margin: 0 !important; height: 100% !important; width: auto !important; outline: none !important; }
}

/* botón de guía rápida (junto a Ayuda) y su popup */
.mediador-app .topbar-guide{ display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid var(--color-border-light); border-radius: 50%; background: var(--color-surface); color: #b7791f; cursor: pointer; }
.mediador-app .topbar-guide svg{ width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.mediador-app .topbar-guide:hover{ background: #fff8e6; }
@media (max-width: 767px){
  .mediador-app .topbar-actions{ gap: 5px; }
  .mediador-app .topbar-help, .mediador-app .topbar-guide, .mediador-app .topbar-support, .mediador-app .topbar-bell{ width: 40px; height: 40px; min-width: 40px; }
  .mediador-app .topbar-guide{ padding: 0; border: 1px solid #efe2bd; background: #fff8e6; }
  .mediador-app .topbar-guide svg{ width: 20px; height: 20px; }
}
.mediador-app .guide-modal{ max-width: 520px; }
.mediador-app .guide-eyebrow{ font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--color-brand-dark); margin-bottom: 2px; }
.mediador-app .guide-body{ max-height: 62vh; overflow-y: auto; }
.mediador-app .guide-purpose{ margin: 0 0 12px; font-size: 15.5px; line-height: 1.5; color: var(--color-text); }
.mediador-app .guide-label{ font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--color-text-muted); margin: 14px 0 6px; }
.mediador-app .guide-list{ margin: 0; padding-left: 20px; display: grid; gap: 8px; font-size: 14.5px; line-height: 1.5; }
.mediador-app .guide-list li::marker{ color: var(--color-brand-dark); font-weight: 700; }
.mediador-app .guide-modal .modal-footer{ display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.mediador-app .guide-more{ display: inline-flex; align-items: center; text-decoration: none; }

/* novedades: avisos por palabra clave y recuadro del Inicio */
.mediador-app .news-kw-box{ display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; min-height: 34px; align-items: center; }
.mediador-app .news-kw{ display: inline-flex; align-items: center; gap: 6px; padding: 6px 6px 6px 13px; border-radius: 999px; background: var(--color-brand-soft); color: var(--color-brand-dark); font-weight: 600; font-size: 14px; }
.mediador-app .news-kw button{ width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; background: rgba(21,155,145,.18); color: inherit; cursor: pointer; font-size: 15px; line-height: 1; }
.mediador-app .news-sugg-row{ display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; font-size: 13px; color: var(--color-text-muted); }
.mediador-app .news-sugg{ padding: 5px 12px; border: 1px dashed var(--color-border); border-radius: 999px; background: none; color: var(--color-text-secondary); cursor: pointer; font: inherit; font-size: 13px; }
.mediador-app .news-sugg:hover{ border-color: var(--color-brand); color: var(--color-brand-dark); }







/* guia "por donde seguimos": boton del Inicio + popup */
.mediador-app .dash-firststeps{ display: flex; align-items: center; gap: 10px; width: 100%; margin: 0 0 16px; padding: 8px 14px 8px 8px; border: 1px solid var(--color-border-light); border-radius: var(--radius-pill); background: var(--color-surface); font: inherit; font-size: 14.5px; color: var(--color-text); cursor: pointer; text-align: left; overflow: hidden; }
.mediador-app .dash-firststeps .badge{ flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 32px; padding: 0 10px; border-radius: var(--radius-pill); background: var(--color-brand); color: var(--color-sidebar); font-weight: 700; font-size: 13.5px; }
.mediador-app .dash-firststeps strong{ flex: 0 0 auto; }
.mediador-app .dash-firststeps .next{ color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.setup-modal{ max-width: 760px; width: calc(100% - 24px); }
.setup-modal .modal-header h3{ margin: 0; font-size: 22px; }
.setup-modal .setup-sub{ margin-top: 4px; font-size: 14px; color: var(--color-text-muted, #64748b); font-weight: 400; }
.setup-modal .modal-body{ padding-top: 22px; }
.setup-modal .setup-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.setup-modal .setup-grid[hidden]{ display: none; }
.setup-modal .setup-more{ margin-top: 22px; }
.setup-modal .setup-card{ position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 16px 16px 14px; border: 0; border-radius: 18px; background: #f1f3f7; font: inherit; text-align: left; color: inherit; cursor: pointer; }
.setup-modal .setup-card:hover{ box-shadow: 0 2px 10px rgba(15,23,42,.12); }
.setup-modal .setup-n{ position: absolute; top: -10px; left: 12px; width: 26px; height: 26px; border-radius: 50%; background: #0f766e; color: #fff; font-weight: 700; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; border: 3px solid #fff; box-sizing: content-box; }
.setup-modal .setup-ico{ width: 38px; height: 38px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: #d9f2ef; color: #0f766e; margin-top: 4px; }
.setup-modal .setup-ico svg{ width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.setup-modal .setup-card strong{ font-size: 16px; line-height: 1.3; }
.setup-modal .setup-text{ font-size: 14px; color: #64748b; line-height: 1.4; }
.setup-modal .setup-cta{ margin-top: 4px; font-weight: 600; font-size: 14px; color: #0f766e; }
.setup-modal .setup-later{ display: inline-flex; align-items: center; gap: 6px; margin-top: 22px; padding: 0; border: 0; background: none; font: inherit; font-weight: 600; font-size: 14.5px; color: #0f766e; cursor: pointer; }
.setup-modal .setup-later svg{ width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
.setup-modal .setup-later[aria-expanded="true"] svg{ transform: rotate(180deg); }
@media (max-width: 767px){
  .setup-modal .setup-grid{ grid-template-columns: 1fr; gap: 22px; }
  .setup-modal .modal-footer{ flex-wrap: wrap; }
}
