/* Ads + Redes — mismo diseño que Ruta SEO (estilos.css); solo cambia el acento a añil para saber en qué app se está. */
:root{
  --accent:#3A4FC4; --accent-ink:#FFFFFF; --accent-soft:#E6E9FA; --accent-line:#BCC4F0; --accent-hover:#2F41A8;
  --side:#141A33; --side-2:#1C2342; --side-activo:#252E57; --side-line:#283158; --side-muted:#98A1C8; --side-ink:#E4E7F5;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --accent:#8796F0; --accent-ink:#0D1130; --accent-soft:#1E2550; --accent-line:#34407E; --accent-hover:#A0ADF5;
  }
}
:root[data-theme="dark"]{
  --accent:#8796F0; --accent-ink:#0D1130; --accent-soft:#1E2550; --accent-line:#34407E; --accent-hover:#A0ADF5;
}
.ads-pasos{display:grid; gap:10px}
.ads-paso{display:flex; gap:12px; align-items:flex-start; padding:12px 14px; border:1px solid var(--line-soft); border-radius:var(--r-s); background:var(--surface-2)}
.ads-paso .marca{flex:none; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:12px; font-weight:700; background:var(--line); color:var(--muted)}
.ads-paso.hecho .marca{background:var(--ok-soft); color:var(--ok)}
.ads-paso b{display:block; font-size:14px}
.ads-paso p{font-size:13px; color:var(--muted); margin-top:2px}
.ads-form{display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:12px 14px; align-items:end}
.ads-form .ancho{grid-column:1 / -1}
.ads-form .acciones{display:flex; gap:8px; grid-column:1 / -1}
.ads-memo{padding:12px 18px; border-bottom:1px solid var(--line-soft); display:grid; gap:6px}
.ads-memo:last-child{border-bottom:0}
.ads-memo .cab{display:flex; gap:8px; flex-wrap:wrap; align-items:center; font-size:12.5px; color:var(--muted)}
.ads-memo .txt{font-size:14px}
.ads-memo .resp{font-size:13px; color:var(--ink-2); background:var(--accent-soft); padding:8px 10px; border-radius:var(--r-s)}
.ads-reglas{border-bottom:1px solid var(--line-soft); font-size:13.5px}
.ads-reglas ul{margin:6px 0 0 18px; color:var(--ink-2)}
.ads-proximo li{margin:6px 0 0 18px; font-size:13.5px; color:var(--ink-2)}
.ads-cifras{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:14px}
.ads-cifras div{display:flex; flex-direction:column; gap:2px}
.ads-cifras b{font-family:var(--f-titulo); font-size:22px; font-variant-numeric:tabular-nums}
.ads-pasos-script li{margin:4px 0 0 18px; font-size:13.5px}
.ads-zona .fila{display:flex; gap:6px}
.ads-grupo{border:1px solid var(--line-soft); border-radius:var(--r-s); padding:12px; margin-bottom:10px; background:var(--surface-2)}
.ads-trabajando{display:flex; gap:12px; align-items:center}
.ads-giro{width:18px; height:18px; border-radius:50%; border:2px solid var(--accent-soft); border-top-color:var(--accent); animation:ads-giro 0.9s linear infinite; flex:none}
@keyframes ads-giro{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ads-giro{animation:none}}
.ads-prop .cab .btn{margin-right:4px}
.ads-auto{display:grid; gap:8px; border-bottom:1px solid var(--line-soft); font-size:13.5px}
.ads-auto select{width:auto; padding:3px 8px; font-size:12.5px; margin-left:6px}
@media (max-width:640px){ .ads-form{grid-template-columns:1fr} }