.sg{--navy:#0f2444;--navy2:#1a3a6b;--gold:#f59e0b;--gold2:#d97706;--green:#059669;--red:#dc2626;--bg:#f0f4f8;--white:#fff;--text:#1e293b;--muted:#64748b;--border:#e2e8f0;background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--font-inter), Inter, system-ui, sans-serif;padding-bottom:env(safe-area-inset-bottom,0px);line-height:1.6}.sg *,.sg :before,.sg :after{box-sizing:border-box;margin:0;padding:0}.sg .barra{background:var(--navy);justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;display:flex}.sg .marca{color:var(--white);letter-spacing:.3px;font-size:13px;font-weight:800}.sg .marca span{color:var(--gold)}.sg .insignia-barra{color:#ffffffb3;white-space:nowrap;background:#ffffff1a;border:1px solid #ffffff26;border-radius:100px;padding:4px 10px;font-size:10.5px;font-weight:600}.sg .hero{background:var(--navy);text-align:center;padding:44px 20px 40px}.sg .hero-eyebrow{color:var(--gold);letter-spacing:2px;text-transform:uppercase;background:#f59e0b26;border:1px solid #f59e0b4d;border-radius:100px;margin-bottom:18px;padding:5px 14px;font-size:11px;font-weight:700;display:inline-block}.sg .hero h1{color:var(--white);max-width:620px;margin:0 auto 12px;font-size:clamp(24px,5vw,38px);font-weight:900;line-height:1.15}.sg .hero p{color:#ffffffa6;max-width:460px;margin:0 auto;font-size:14.5px;line-height:1.7}.sg .wrap{max-width:640px;margin:0 auto;padding:28px 16px 72px}.sg .progreso{align-items:center;gap:10px;margin-bottom:18px;display:flex}.sg .progreso-barra{background:var(--border);border-radius:100px;flex:1;height:4px;overflow:hidden}.sg .progreso-fill{background:linear-gradient(90deg, var(--navy), var(--gold));border-radius:100px;height:100%;transition:width .35s}.sg .progreso-tag{color:var(--muted);white-space:nowrap;font-size:12px;font-weight:700}.sg .paso{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:26px 22px;box-shadow:0 1px 2px #0f24440d}.sg .paso-num{letter-spacing:2px;color:var(--gold2);text-transform:uppercase;margin-bottom:8px;font-size:11px;font-weight:700}.sg .paso-pregunta{color:var(--navy);margin-bottom:6px;font-size:clamp(17px,2.5vw,21px);font-weight:800;line-height:1.3}.sg .paso-sub{color:var(--muted);margin-bottom:20px;font-size:13px}.sg .opciones{flex-direction:column;gap:10px;display:flex}.sg .opcion{border:2px solid var(--border);cursor:pointer;text-align:left;background:0 0;border-radius:12px;width:100%;padding:15px 16px;font-family:inherit;transition:border-color .15s,background .15s}.sg .opcion:hover{border-color:var(--navy2)}.sg .opcion-t{color:var(--navy);font-size:14.5px;font-weight:700;display:block}.sg .opcion-d{color:var(--muted);margin-top:2px;font-size:12.5px;line-height:1.5;display:block}.sg .volver{color:var(--muted);cursor:pointer;background:0 0;border:none;padding:14px 0 0;font-family:inherit;font-size:13px;font-weight:700}.sg .volver:hover{color:var(--navy)}.sg .resultado{flex-direction:column;gap:14px;display:flex}.sg .res-hero{text-align:center;border:1px solid;border-radius:12px;padding:30px 22px 26px}.sg .res-simplificado{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border-color:#bbf7d0}.sg .res-moderado{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-color:#fde68a}.sg .res-maximo{background:linear-gradient(135deg,#fef2f2,#fee2e2);border-color:#fecaca}.sg .res-emoji{margin-bottom:10px;font-size:46px;line-height:1}.sg .res-insignia{letter-spacing:2px;text-transform:uppercase;color:var(--navy);background:#0f244414;border-radius:100px;margin-bottom:10px;padding:5px 14px;font-size:11px;font-weight:700;display:inline-block}.sg .res-titulo{color:var(--navy);font-size:clamp(19px,3vw,25px);font-weight:900;line-height:1.2}.sg .res-criterios{color:var(--muted);margin-top:8px;font-size:13px}.sg .bloque{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:22px;box-shadow:0 1px 2px #0f24440d}.sg .bloque h3{color:var(--navy);margin-bottom:14px;font-size:15px;font-weight:800}.sg .punto{border-bottom:1px solid var(--border);align-items:flex-start;gap:12px;padding:10px 0;font-size:13.5px;line-height:1.5;display:flex}.sg .punto:last-child{border-bottom:none;padding-bottom:0}.sg .punto-dot{background:var(--gold);border-radius:50%;flex-shrink:0;width:8px;height:8px;margin-top:7px}.sg .norma{color:var(--muted);border-top:1px solid var(--border);margin-top:14px;padding-top:12px;font-size:12px}.sg .sanciones{background:#fef2f2;border:1px solid #fecaca;border-radius:12px;padding:22px}.sg .sanciones h3{color:#991b1b;margin-bottom:4px;font-size:15px;font-weight:800}.sg .sanciones-sub{color:#b91c1c;margin-bottom:14px;font-size:12.5px}.sg .sancion{border-top:1px solid #fecaca;padding:12px 0}.sg .sancion-t{color:var(--text);font-size:13.5px}.sg .sancion-v{color:#991b1b;margin-top:2px;font-size:17px;font-weight:900}.sg .sancion-d{color:var(--muted);font-size:12px}.sg .cierre{background:var(--navy);text-align:center;border-radius:12px;padding:28px 22px}.sg .cierre h3{color:var(--white);margin-bottom:8px;font-size:18px;font-weight:800}.sg .cierre p{color:#ffffffa6;margin-bottom:20px;font-size:13px;line-height:1.7}.sg .btn-oro{background:var(--gold);color:#111827;text-align:center;cursor:pointer;border:none;border-radius:12px;width:100%;padding:15px 28px;font-family:inherit;font-size:15px;font-weight:800;text-decoration:none;transition:background .15s;display:block}.sg .btn-oro:hover{background:var(--gold2)}.sg .btn-borde{text-align:center;width:100%;color:var(--white);cursor:pointer;background:0 0;border:2px solid #ffffff40;border-radius:12px;margin-top:10px;padding:13px 20px;font-family:inherit;font-size:14px;font-weight:700;text-decoration:none;transition:border-color .15s;display:block}.sg .btn-borde:hover{border-color:var(--gold)}.sg .cierre-nota{color:#fff6;margin-top:12px;font-size:11.5px;line-height:1.6}.sg .descargo{color:var(--muted);text-align:center;padding:0 4px;font-size:11.5px;line-height:1.6}.sg .reiniciar{border:2px solid var(--border);color:var(--muted);cursor:pointer;background:0 0;border-radius:12px;width:100%;padding:12px 20px;font-family:inherit;font-size:13px;font-weight:700}.sg .reiniciar:hover{border-color:var(--navy);color:var(--navy)}@media (max-width:500px){.sg .paso,.sg .bloque,.sg .sanciones,.sg .cierre{padding:20px 16px}}