/* Safe — wizard AI Act.
   Claro pero precioso: una sola familia tipográfica, mucho aire, un color
   de marca para la acción principal y verde/ámbar/rojo reservados a los
   estados del resultado. Modo oscuro automático. */
:root {
  --bg:#f6f7f9; --card:#ffffff; --card2:#f2f4f7; --text:#121826;
  --sec:#475069; --muted:#6b7489; --line:#e3e7ee; --line2:#eef1f5;
  --brand:#2f4bd8; --brand-in:#ffffff; --brandbg:#eef1fe; --brand2:#1f36b0;
  --good:#1f7a4d; --goodbg:#e7f5ed; --warn:#9a5a00; --warnbg:#fff3df;
  --bad:#b4271c; --badbg:#fdecea; --info:#475069; --infobg:#eef1f5;
  --sombra:0 1px 2px rgba(18,24,38,.04), 0 4px 16px rgba(18,24,38,.06);
  --sombra2:0 8px 30px rgba(18,24,38,.12);
  --radio:16px; --radio-s:12px;
  --fuente:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
           "Helvetica Neue", Arial, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg:#0d1117; --card:#161b24; --card2:#1d2330; --text:#e8ecf3;
    --sec:#b4bccb; --muted:#8a93a6; --line:#2a3242; --line2:#212837;
    --brand:#8ea2ff; --brand-in:#0d1117; --brandbg:#1d2547; --brand2:#a9b8ff;
    --good:#6fcf97; --goodbg:#13291e; --warn:#f2b45a; --warnbg:#2e230f;
    --bad:#f08a80; --badbg:#3a1a18; --info:#b4bccb; --infobg:#212837;
    --sombra:0 1px 2px rgba(0,0,0,.3), 0 4px 16px rgba(0,0,0,.25);
    --sombra2:0 8px 30px rgba(0,0,0,.45);
  }
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--text);
       font:16px/1.6 var(--fuente); -webkit-font-smoothing:antialiased; }
a { color:var(--brand); }
h1 { font-size:28px; line-height:1.25; font-weight:700; margin:0;
     letter-spacing:-.02em; }
h2 { font-size:18px; font-weight:650; margin:0; letter-spacing:-.01em; }
h3 { font-size:16px; font-weight:650; margin:0; }
.sub { color:var(--sec); font-size:14px; }
.muted { color:var(--muted); }
.peq { font-size:13px; }
.wrap { max-width:1160px; margin:0 auto; padding:28px 16px 64px; }
.wrap.estrecha { max-width:760px; }
:focus-visible { outline:3px solid var(--brand); outline-offset:2px;
                 border-radius:8px; }
.oculto { display:none !important; }

/* --- Cabecera --- */
.barra { position:sticky; top:0; z-index:30; background:color-mix(in srgb,
         var(--card) 88%, transparent); backdrop-filter:saturate(1.4) blur(10px);
         border-bottom:1px solid var(--line); }
.barra-in { max-width:1160px; margin:0 auto; padding:0 16px; height:60px;
            display:flex; align-items:center; gap:20px; }
.marca { display:inline-flex; align-items:center; gap:9px; font-size:19px;
         font-weight:800; letter-spacing:-.02em; color:var(--text);
         text-decoration:none; }
.marca::before { content:""; width:26px; height:26px; border-radius:8px;
                 background:linear-gradient(135deg, var(--brand), #7c4ddb);
                 box-shadow:inset 0 0 0 6px rgba(255,255,255,.25); }
.marca.grande { font-size:34px; justify-content:center; display:flex;
                margin:0 0 26px; }
.marca.grande::before { width:38px; height:38px; border-radius:11px; }
.menu { display:flex; gap:2px; flex:1; overflow-x:auto; scrollbar-width:none; }
.menu::-webkit-scrollbar { display:none; }
.menu a { text-decoration:none; color:var(--sec); font-size:14.5px;
          font-weight:550; padding:7px 12px; border-radius:9px;
          white-space:nowrap; }
.menu a:hover { background:var(--card2); color:var(--text); }
.menu a.on { color:var(--text); background:var(--card2); }
.yo { display:flex; align-items:center; gap:10px; flex:none; }
.avatar { width:30px; height:30px; border-radius:50%; background:var(--brandbg);
          color:var(--brand); display:flex; align-items:center;
          justify-content:center; font-size:13px; font-weight:700; }
.yo a { font-size:13.5px; color:var(--muted); text-decoration:none; }
.yo a:hover { color:var(--bad); }
@media (max-width:640px) {
  .barra-in { gap:10px; }
  .marca { font-size:17px; }
}

/* --- Tarjetas y botones --- */
.card { background:var(--card); border:1px solid var(--line);
        border-radius:var(--radio); box-shadow:var(--sombra);
        padding:22px 24px; margin:0 0 20px; }
@media (max-width:560px) { .card { padding:18px 16px; } }
.cab { display:flex; align-items:center; gap:12px; margin:-2px 0 14px; }
.cab .tit { flex:1; min-width:0; }
.cab .tit .sub { font-size:13px; color:var(--muted); }
.btn { display:inline-flex; align-items:center; justify-content:center;
       gap:8px; font:inherit; font-size:15px; font-weight:600;
       padding:10px 18px; border-radius:11px; border:1px solid transparent;
       cursor:pointer; text-decoration:none; white-space:nowrap;
       background:var(--brand); color:var(--brand-in);
       transition:filter .15s, background .15s, transform .1s; }
.btn:hover { filter:brightness(1.08); }
.btn:active { transform:translateY(1px); }
.btn.sec { background:var(--card); color:var(--text); border-color:var(--line); }
.btn.sec:hover { background:var(--card2); filter:none; }
.btn.fant { background:transparent; color:var(--sec); }
.btn.fant:hover { background:var(--card2); filter:none; }
.btn.peq { font-size:13px; padding:6px 11px; border-radius:9px; }
.btn.peligro { color:var(--bad); }
.btn:disabled { opacity:.45; cursor:default; filter:none; }
.fila { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

/* --- Formularios --- */
input, select, textarea { padding:10px 12px; border-radius:10px;
  border:1px solid var(--line); background:var(--card); color:var(--text);
  font:inherit; font-size:15px; max-width:100%; width:100%; }
input[type=checkbox], input[type=radio] { width:auto; }
input:focus, select:focus, textarea:focus { outline:3px solid var(--brandbg);
  border-color:var(--brand); }
textarea { min-height:90px; resize:vertical; }
label.campo { display:flex; flex-direction:column; gap:6px; font-size:14px;
              color:var(--sec); font-weight:550; }
.msg { font-size:14px; color:var(--sec); margin:8px 0 0; min-height:1em; }
.msg:empty { display:none; }
.msg.error { color:var(--bad); }

/* --- Etiquetas de estado --- */
.chip { display:inline-flex; align-items:center; gap:5px; font-size:12.5px;
        font-weight:600; padding:3px 10px; border-radius:999px;
        background:var(--infobg); color:var(--info); white-space:nowrap; }
.chip.ok { background:var(--goodbg); color:var(--good); }
.chip.aviso { background:var(--warnbg); color:var(--warn); }
.chip.mal { background:var(--badbg); color:var(--bad); }
.chip.azul { background:var(--brandbg); color:var(--brand); }
.chips { display:flex; gap:6px; flex-wrap:wrap; }

table { width:100%; border-collapse:collapse; font-size:14px; }
th { text-align:left; color:var(--muted); font-weight:550; font-size:12.5px;
     padding:8px 8px; }
td { padding:9px 8px; border-top:1px solid var(--line2); vertical-align:top; }
.tabla { overflow-x:auto; }
.vacio { color:var(--muted); padding:26px 0; text-align:center; font-size:15px; }

/* --- Login --- */
.entrar { min-height:100vh; display:flex; align-items:center;
          justify-content:center; padding:24px 16px; }
.entrar .caja { width:100%; max-width:390px; }

/* ===================== Inicio ===================== */
.hero { display:flex; align-items:flex-end; justify-content:space-between;
        gap:16px; flex-wrap:wrap; margin:6px 0 24px; }
.hero p { margin:6px 0 0; color:var(--sec); max-width:640px; }
.rejilla { display:grid; grid-template-columns:repeat(auto-fill,
           minmax(300px, 1fr)); gap:16px; }
.uso { display:flex; flex-direction:column; gap:10px; text-decoration:none;
       color:inherit; background:var(--card); border:1px solid var(--line);
       border-radius:var(--radio); padding:18px 20px; box-shadow:var(--sombra);
       transition:transform .15s, box-shadow .15s, border-color .15s; }
.uso:hover { transform:translateY(-2px); box-shadow:var(--sombra2);
             border-color:color-mix(in srgb, var(--brand) 30%, var(--line)); }
.uso h3 { font-size:16.5px; line-height:1.35; }
.uso .pie { margin-top:auto; display:flex; align-items:center; gap:10px;
            font-size:13px; color:var(--muted); }
.barrita { height:4px; border-radius:4px; background:var(--line2);
           overflow:hidden; flex:1; }
.barrita i { display:block; height:100%; background:var(--brand);
             border-radius:4px; }
.plantillas { display:grid; grid-template-columns:repeat(auto-fill,
              minmax(210px, 1fr)); gap:12px; }
.plantilla { text-align:left; font:inherit; color:inherit; cursor:pointer;
             background:var(--card); border:1px solid var(--line);
             border-radius:var(--radio-s); padding:14px 16px;
             transition:border-color .15s, background .15s; }
.plantilla:hover { border-color:var(--brand); background:var(--brandbg); }
.plantilla .ico { font-size:22px; }
.plantilla b { display:block; margin:6px 0 2px; font-size:15px; }
.plantilla span { font-size:13px; color:var(--muted); }
.plantilla.blanca { border-style:dashed; }
.linea-tiempo { display:flex; gap:0; overflow-x:auto; padding:6px 0 2px; }
.hito { flex:1; min-width:118px; position:relative; padding:18px 8px 0 0;
        font-size:12.5px; color:var(--muted); }
.hito::before { content:""; position:absolute; top:5px; left:0; right:0;
                height:2px; background:var(--line); }
.hito::after { content:""; position:absolute; top:0; left:0; width:12px;
               height:12px; border-radius:50%; background:var(--card);
               border:2px solid var(--muted); }
.hito.pasado::after { background:var(--muted); }
.hito.hoy::after { background:var(--brand); border-color:var(--brand); }
.hito b { display:block; color:var(--text); font-size:13px; }

/* ===================== Wizard ===================== */
.wz { display:grid; grid-template-columns:minmax(0, 1fr) 320px; gap:28px;
      align-items:start; }
@media (max-width:980px) { .wz { grid-template-columns:1fr; } }
.wz-top { display:flex; align-items:center; gap:12px; margin:0 0 18px;
          flex-wrap:wrap; }
.wz-top .nombre { font-weight:650; flex:1; min-width:0; overflow:hidden;
                  text-overflow:ellipsis; white-space:nowrap; }
.modo { display:inline-flex; background:var(--card2); border-radius:10px;
        padding:3px; border:1px solid var(--line); }
.modo button { font:inherit; font-size:13.5px; font-weight:600; border:0;
               background:transparent; color:var(--sec); padding:6px 12px;
               border-radius:8px; cursor:pointer; }
.modo button.on { background:var(--card); color:var(--text);
                  box-shadow:var(--sombra); }
.progreso { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px;
            margin:0 0 6px; }
.progreso div { font-size:12px; color:var(--muted); font-weight:600; }
.progreso div.on { color:var(--text); }
.progreso i { display:block; height:4px; border-radius:4px;
              background:var(--line); margin-top:6px; overflow:hidden; }
.progreso i b { display:block; height:100%; background:var(--brand);
                border-radius:4px; transition:width .3s; }
.restante { font-size:12.5px; color:var(--muted); margin:0 0 18px; }

.pregunta { background:var(--card); border:1px solid var(--line);
            border-radius:20px; box-shadow:var(--sombra);
            padding:34px 36px 26px; }
@media (max-width:560px) { .pregunta { padding:24px 18px 18px;
                                       border-radius:16px; } }
.pregunta .bloque { font-size:12.5px; font-weight:700; color:var(--brand);
                    text-transform:uppercase; letter-spacing:.06em; }
.pregunta h1 { margin:8px 0 10px; max-width:30ch; font-size:28px; }
@media (max-width:560px) { .pregunta h1 { font-size:23px; } }
.pregunta .ctx { color:var(--sec); max-width:64ch; margin:0 0 6px; }
.apertura { background:var(--brandbg); color:var(--text); border-radius:12px;
            padding:12px 14px; font-size:14.5px; margin:0 0 20px; }
.sugerencia { background:var(--warnbg); color:var(--warn); border-radius:10px;
              padding:8px 12px; font-size:13.5px; margin:10px 0 0;
              font-weight:550; }
.propuesta { display:inline-flex; gap:6px; align-items:center;
             background:var(--brandbg); color:var(--brand); border-radius:8px;
             padding:3px 9px; font-size:12.5px; font-weight:600; margin:0 0 8px; }
.revisado { background:var(--goodbg); color:var(--good); }
.campo-wz { margin:22px 0 0; }
.campo-wz > .tit { font-size:15px; font-weight:650; margin:0 0 10px; }
.opciones { display:grid; grid-template-columns:repeat(auto-fill,
            minmax(240px, 1fr)); gap:10px; }
.opciones.compacto { display:flex; flex-wrap:wrap; gap:8px; }
.opcion { position:relative; display:flex; gap:12px; align-items:flex-start;
          text-align:left; font:inherit; color:inherit; cursor:pointer;
          background:var(--card); border:1.5px solid var(--line);
          border-radius:14px; padding:14px 16px; min-height:56px;
          transition:border-color .15s, background .15s, transform .1s,
          box-shadow .15s; }
.opcion:hover { border-color:color-mix(in srgb, var(--brand) 45%, var(--line)); }
.opcion:active { transform:scale(.99); }
.opcion.on { border-color:var(--brand); background:var(--brandbg);
             box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 18%,
             transparent); }
.opcion .ico { font-size:22px; line-height:1.2; flex:none; }
.opcion .txt { flex:1; min-width:0; }
.opcion .txt b { display:block; font-weight:600; font-size:15px;
                 line-height:1.4; }
.opcion .txt span { display:block; font-size:13px; color:var(--muted);
                    margin-top:3px; line-height:1.45; }
.opcion .marca-op { flex:none; width:20px; height:20px; border-radius:50%;
                    border:2px solid var(--line); margin-top:2px;
                    transition:all .15s; }
.opcion.multi .marca-op { border-radius:6px; }
.opcion.on .marca-op { background:var(--brand); border-color:var(--brand);
                       box-shadow:inset 0 0 0 3px var(--card); }
.opcion .mas { display:inline-block; font-size:11px; font-weight:600;
               color:var(--warn); background:var(--warnbg); border-radius:6px;
               padding:1px 7px; margin-top:6px; }
.opcion .grupo { font-size:11.5px; color:var(--muted); font-weight:600;
                 text-transform:uppercase; letter-spacing:.04em; }
.compacto .opcion { padding:8px 13px; min-height:0; border-radius:999px; }
.compacto .opcion .txt b { font-size:14px; font-weight:550; }
.compacto .opcion .marca-op, .compacto .opcion .txt span { display:none; }
.ver-todas { margin:12px 0 0; }
.nose { margin:14px 0 0; display:flex; align-items:center; gap:10px;
        flex-wrap:wrap; }
.nose button { font:inherit; font-size:14px; color:var(--sec);
               background:transparent; border:1.5px dashed var(--line);
               border-radius:999px; padding:6px 14px; cursor:pointer; }
.nose button.on { border-style:solid; border-color:var(--warn);
                  color:var(--warn); background:var(--warnbg); }
.nose .quien { font-size:13px; color:var(--muted); }
.subcampo { margin:12px 0 0 0; padding:14px 16px; border-left:3px solid
            var(--brandbg); background:var(--card2); border-radius:0 12px 12px 0; }
.acciones { display:flex; align-items:center; gap:10px; margin:30px 0 0;
            flex-wrap:wrap; }
.acciones .esp { flex:1; }
.masinfo { font:inherit; font-size:14px; background:none; border:0;
           color:var(--brand); cursor:pointer; padding:4px 0; font-weight:600; }
.resumen { display:grid; grid-template-columns:170px 1fr; gap:0;
           border:1px solid var(--line); border-radius:12px; overflow:hidden;
           margin:18px 0 0; }
.resumen div { padding:10px 14px; border-top:1px solid var(--line2);
               font-size:14.5px; }
.resumen div:nth-child(-n+2) { border-top:0; }
.resumen .k { color:var(--muted); background:var(--card2); font-size:13.5px; }
@media (max-width:560px) { .resumen { grid-template-columns:1fr; }
  .resumen .k { border-top:1px solid var(--line2); } }
.salida { border-radius:14px; padding:16px 18px; margin:18px 0 0;
          font-size:16px; }
.salida.dentro { background:var(--brandbg); }
.salida.fuera { background:var(--goodbg); }
.salida.pendiente { background:var(--warnbg); }
.papel { border:1px solid var(--line); border-radius:12px; padding:12px 14px;
         margin:12px 0 0; }
.papel b { text-transform:capitalize; }
.papel p { margin:4px 0 0; font-size:14px; color:var(--sec); }
.aviso-separar { background:var(--warnbg); border-radius:12px;
                 padding:12px 14px; margin:16px 0 0; display:flex; gap:12px;
                 align-items:center; flex-wrap:wrap; font-size:14.5px; }
.entra { animation:entra .26s ease-out both; }
@keyframes entra { from { opacity:0; transform:translateY(8px); }
                   to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { .entra { animation:none; } }

/* Panel lateral */
.panel { position:sticky; top:80px; display:flex; flex-direction:column;
         gap:14px; }
@media (max-width:980px) { .panel { position:static; }
  .panel .recorrido { display:none; } }
.panel .card { padding:16px 18px; margin:0; }
.panel h3 { font-size:13px; text-transform:uppercase; letter-spacing:.06em;
            color:var(--muted); margin:0 0 10px; }
.concl { list-style:none; margin:0; padding:0; display:flex;
         flex-direction:column; gap:8px; font-size:14px; }
.concl li { display:flex; gap:8px; align-items:flex-start; }
.concl li::before { content:""; flex:none; width:8px; height:8px;
                    border-radius:50%; margin-top:7px; background:var(--muted); }
.concl li.ok::before { background:var(--good); }
.concl li.aviso::before { background:var(--warn); }
.concl li.mal::before { background:var(--bad); }
.concl li.info::before { background:var(--brand); }
.pasos { list-style:none; margin:0; padding:0; font-size:13.5px; }
.pasos li { padding:5px 0; display:flex; gap:8px; align-items:baseline;
            color:var(--muted); cursor:pointer; }
.pasos li.hecha { color:var(--sec); }
.pasos li.hecha::before { content:"✓"; color:var(--good); font-weight:700; }
.pasos li.actual { color:var(--text); font-weight:650; }
.pasos li.actual::before { content:"●"; color:var(--brand); }
.pasos li:not(.hecha):not(.actual)::before { content:"○"; }
.pasos li:hover { color:var(--text); }
.hechos { font-size:13px; }
.hechos td { padding:6px 4px; }
.hechos td:first-child { color:var(--muted); width:46%; }
.hechos tr { cursor:pointer; }
.hechos tr:hover td { background:var(--card2); }
.reglas-mini { display:flex; flex-wrap:wrap; gap:5px; }
.reglas-mini span { font-size:11.5px; font-weight:700; padding:2px 7px;
                    border-radius:6px; background:var(--infobg);
                    color:var(--muted); }
.reglas-mini span.aplicable { background:var(--brandbg); color:var(--brand); }
.reglas-mini span.pendiente { background:var(--warnbg); color:var(--warn); }

/* Cajón de ayuda */
.cajon-fondo { position:fixed; inset:0; background:rgba(10,14,22,.35);
               opacity:0; pointer-events:none; transition:opacity .2s;
               z-index:40; }
.cajon { position:fixed; top:0; right:0; bottom:0; width:min(440px, 100%);
         background:var(--card); box-shadow:var(--sombra2); z-index:41;
         transform:translateX(100%); transition:transform .25s ease;
         padding:26px 24px; overflow-y:auto; }
.cajon.abierto { transform:none; }
.cajon-fondo.abierto { opacity:1; pointer-events:auto; }
.cajon .cerrar { position:absolute; top:14px; right:14px; }
.cajon p { color:var(--sec); }
.cajon .art { display:inline-block; margin:6px 0 0; font-size:13px;
              font-weight:600; color:var(--brand); background:var(--brandbg);
              border-radius:7px; padding:3px 9px; }

/* ===================== Resultado ===================== */
.res-cab { margin:0 0 24px; }
.res-cab .frase { font-size:22px; line-height:1.4; font-weight:600;
                  letter-spacing:-.01em; margin:10px 0 14px; max-width:60ch; }
@media (max-width:560px) { .res-cab .frase { font-size:19px; } }
.grupo-res { margin:30px 0 0; }
.grupo-res > h2 { display:flex; align-items:center; gap:10px; margin:0 0 4px; }
.grupo-res > .sub { margin:0 0 14px; }
.ob { background:var(--card); border:1px solid var(--line);
      border-radius:var(--radio); box-shadow:var(--sombra); padding:20px 22px;
      margin:12px 0 0; border-left:5px solid var(--brand); }
.ob.futura { border-left-color:var(--muted); }
.ob.pendiente { border-left-color:var(--warn); }
.ob.prohibida { border-left-color:var(--bad); }
.ob .ob-cab { display:flex; gap:10px; align-items:flex-start;
              justify-content:space-between; flex-wrap:wrap; }
.ob h3 { font-size:17.5px; line-height:1.35; }
.ob .act { margin:8px 0 0; font-size:15.5px; max-width:70ch; }
.ob .porque { margin:10px 0 0; font-size:13.5px; color:var(--sec); }
.ob .porque b { color:var(--text); font-weight:600; }
.ob .meta { margin:10px 0 0; display:flex; gap:14px; flex-wrap:wrap;
            font-size:12.5px; color:var(--muted); }
.ob .nota { margin:10px 0 0; font-size:13.5px; background:var(--card2);
            border-radius:10px; padding:8px 12px; color:var(--sec); }
.ejec { margin:16px 0 0; padding:14px 0 0; border-top:1px solid var(--line2);
        display:grid; grid-template-columns:repeat(4, 1fr); gap:10px;
        align-items:end; }
.ejec label { font-size:12.5px; }
.ejec .ancho { grid-column:1 / -1; }
@media (max-width:760px) { .ejec { grid-template-columns:1fr 1fr; } }
.archivos { font-size:13px; display:flex; flex-wrap:wrap; gap:6px; }
.archivos a { background:var(--card2); border-radius:7px; padding:3px 9px;
              text-decoration:none; }
.cierre { border-radius:var(--radio); padding:22px 24px; margin:0 0 20px; }
.cierre.fuera { background:var(--goodbg); }
.cierre.prohibida { background:var(--badbg); }
.pend { display:grid; grid-template-columns:1fr 220px; gap:14px;
        padding:14px 0; border-top:1px solid var(--line2); }
.pend:first-of-type { border-top:0; }
@media (max-width:640px) { .pend { grid-template-columns:1fr; } }
.pie-legal { font-size:13px; color:var(--muted); margin:36px 0 0;
             padding:16px 0 0; border-top:1px solid var(--line); }
details.plegable { background:var(--card); border:1px solid var(--line);
                   border-radius:var(--radio); padding:14px 20px; margin:16px 0 0; }
details.plegable summary { cursor:pointer; font-weight:650; }
details.plegable[open] summary { margin-bottom:10px; }

@media print {
  .barra, .no-print, .ejec input, .ejec select, .modo, .btn { display:none !important; }
  body { background:#fff; color:#000; font-size:12px; }
  .wrap { padding:0; max-width:none; }
  .ob, .card, .cierre { box-shadow:none; break-inside:avoid; }
  details.plegable { display:block; }
  details.plegable > * { display:block; }
  a { color:inherit; text-decoration:none; }
}

/* --- Ayudas desplegables --- */
.op { display:flex; flex-direction:column; gap:0; }
.opciones:has(details.ayuda-op[open]) { align-items:start; }
.op .opcion { flex:1; }
.compacto .op { display:contents; }
details.ayuda-campo, details.ayuda-op { font-size:14px; }
details.ayuda-campo { margin:0 0 14px; }
details.ayuda-campo > summary, details.ayuda-op > summary {
  list-style:none; cursor:pointer; display:inline-flex; align-items:center;
  gap:6px; font-weight:600; color:var(--brand); border-radius:8px;
  user-select:none; }
details > summary::-webkit-details-marker { display:none; }
details.ayuda-campo > summary { font-size:14px; padding:4px 10px 4px 6px;
  background:var(--brandbg); }
details.ayuda-campo > summary::before, details.ayuda-op > summary::before {
  content:"?"; display:inline-flex; align-items:center; justify-content:center;
  width:18px; height:18px; border-radius:50%; font-size:11.5px; font-weight:800;
  background:var(--brand); color:var(--brand-in); }
details.ayuda-campo[open] > summary::after, details.ayuda-op[open] > summary::after {
  content:"✕"; font-size:11px; color:var(--muted); margin-left:2px; }
details.ayuda-campo > p { margin:8px 0 0; padding:12px 14px; border-radius:12px;
  background:var(--brandbg); color:var(--text); line-height:1.55;
  max-width:68ch; }
details.ayuda-op { margin:4px 0 0 4px; }
details.ayuda-op > summary { font-size:12.5px; padding:2px 4px; }
details.ayuda-op > summary::before { width:15px; height:15px; font-size:10px; }
details.ayuda-op > p { margin:4px 0 2px; padding:9px 12px; border-radius:10px;
  background:var(--card2); color:var(--sec); font-size:13.5px; line-height:1.5; }
details[open] > p { animation:entra .2s ease-out both; }
@media print { details.ayuda-campo, details.ayuda-op { display:none; } }

/* --- Opciones compactas (modo experto): etiquetas a la medida del texto --- */
.opciones.compacto { gap:8px; align-items:flex-start; }
.compacto .op .opcion, .compacto .opcion { flex:0 1 auto; width:auto;
  max-width:100%; min-height:0; padding:8px 14px; border-radius:10px;
  align-items:center; gap:8px; }
.compacto .opcion .txt b { font-size:14px; font-weight:550; line-height:1.35;
  white-space:normal; }
.compacto .opcion .ico { font-size:16px; }
.compacto .opcion .mas, .compacto .opcion .grupo { display:none; }
.compacto .opcion.on { box-shadow:none; }
.compacto .opcion.on .txt b { color:var(--brand); }

/* --- Borrar un diagnóstico desde la portada --- */
.uso-caja { position:relative; display:flex; }
.uso-caja .uso { flex:1; }
.uso-caja .uso h3 { padding-right:30px; }
.borrar-uso { position:absolute; top:12px; right:12px; width:34px; height:34px;
  display:flex; align-items:center; justify-content:center; border-radius:10px;
  border:1px solid transparent; background:transparent; color:var(--muted);
  cursor:pointer; opacity:.55; transition:opacity .15s, color .15s,
  background .15s, border-color .15s; }
.uso-caja:hover .borrar-uso, .borrar-uso:focus-visible { opacity:1; }
.borrar-uso:hover { color:var(--bad); background:var(--badbg);
  border-color:color-mix(in srgb, var(--bad) 25%, transparent); }
@media (hover:none) { .borrar-uso { opacity:1; } }

/* --- Safe Creative: registro de evidencias con sello de tiempo --- */
.sc-linea { margin:10px 0 0; font-size:13.5px; color:var(--sec); }
.sc-linea a { font-weight:600; }
.sc-nota { border-left:3px solid var(--brand); }
.sc-bloque { margin:36px 0 0; padding:28px 30px; border-radius:20px;
  background:linear-gradient(135deg, var(--brandbg), var(--card) 70%);
  border:1px solid var(--line); box-shadow:var(--sombra);
  display:grid; grid-template-columns:minmax(0, 1fr) 260px; gap:12px 32px;
  align-items:start; }
.sc-bloque .sc-texto { grid-row:span 2; }
.sc-bloque h2 { font-size:22px; line-height:1.3; margin:6px 0 10px; }
.sc-bloque p { margin:0 0 10px; color:var(--sec); max-width:62ch; }
.sc-bloque p b { color:var(--text); }
.sc-eti { font-size:12.5px; font-weight:700; color:var(--brand);
  text-transform:uppercase; letter-spacing:.06em; }
.sc-matiz { font-size:13.5px; }
.sc-puntos { list-style:none; margin:30px 0 0; padding:0; display:flex;
  flex-direction:column; gap:10px; font-size:14px; font-weight:550; }
.sc-puntos li { display:flex; gap:9px; align-items:flex-start; }
.sc-puntos li::before { content:"✓"; color:var(--good); font-weight:800; }
.sc-bloque .btn { align-self:end; justify-self:start; }
.print-only { display:none; }
@media (max-width:760px) {
  .sc-bloque { grid-template-columns:1fr; padding:22px 18px; }
  .sc-puntos { margin:4px 0 6px; }
}
@media print {
  .sc-bloque { background:none; box-shadow:none; break-inside:avoid; }
  .sc-bloque p, .sc-bloque .sc-matiz, .sc-puntos { font-size:12px; }
  .print-only { display:block; }
}
